css

Interactive Tracker Boxes #1 - HTML

Submitted by Yorkiebar on

Introduction:

This tutorial is on how to create an interactive CSS & JavaScript (jQuery) page where the user is able to hover over certain elements of the page in order to uncover more information (such as the Bing.com search page, where you can hover over the boxes on the image to see interesting facts).

HTML:

This is the first part of this tutorial series, in which we will be creating the HTML and starting CSS for the page. We want to have a title and paragraph for each piece of information on the website, so lets create the basic HTML template first...

Text Effects in CSS

Submitted by GeePee on
This project will teach you how to create a text effect using CSS. I have here two examples, the 3D effect and neon light effect. This is easy to do and pure css. It used various layers of text-shadow to create these effects. Hope you learn from this.

3D Flip Content Using CSS

Submitted by GeePee on
This project will teach you how to animate a 3D effect flip content using css/html only. No javascript code or jQuery plugin needed. Once the user hover over the image, the image flip to back and the information of the image appear. This is very cool animation and simple to do. Hope you learn from this.

Creating Shapes in CSS

Submitted by GeePee on
This project will teach you on how to create a different shapes using CSS. We can create shapes in our web page without including images. This is simple but very useful. This is for the newbie in programming. I have here an example of triangles(left, right, up, bottom), circle, quarter circle and half circle. Hope you learn from this.

Email Subscription List in PHP/HTML

Submitted by Yorkiebar on
Introduction: This tutorial is on how to create a simple email subscription service - part 1 - allowing the user to enter their email address. HTML: Before we can process any information the user enters and then add it to our database of email subscription addresses, we need to take the information from the user - for this we need a simple HTML form.

Web Page Overlay

Submitted by GeePee on
In this project, you will learn how to create overlay and transparent div background. By clicking the images, div overlay will appear with the original size of the image clicked and also it has a transparent background which looks like a new window but it's definitely not. It's just a div set to 100% width and height and opacity of .8 which covers the whole content of the page. Hope you learn from
Subscribe to css