|
|
|
Bring Your Web Site to Life With PHP
PHP: Hypertext Preprocessor, better known as PHP, is a highly popular, server-side scripting language that can be embedded directly into HTML coding. PHP can do anything that CGI can do, such as process form data and auto generate dynamic content,...
Building your first Web Site
The ease with which visitors are able to use a Web Site is very important, especially if you`re trying to market something from the site. Usability is very much about how quickly and easily visitors are able to move around the site and not just...
Learning HTML & HTML Editors
Learning HTML & HTML Editors by Kalina of Affordable Web Design
I hold a firm belief that all webmasters should practice validating their code, so all advice I give in this site will be centered around that belief.
If you'd like to...
Popup: Hate 'em or Love 'em
You are browsing a favorite website when a popup window appears.
You close the window to continue browsing, and another popup
appears. Later on, you realize that several windows have opened
because of these popups. Annoying, isn't it?
Popup...
Real Life Internet Evil: Microsoft's Smart Tags
Our purpose with this series is to use real life examples of deception, fraud and other evil to show how you can better protect yourself. The examples cited in these articles are intended to demonstrate best practices and recommendations.
You've...
|
|
| |
|
|
|
|
|
|
Showing and Hiding HTML elements using Layers
A long time back I visited a site that had a very fancy, animated navigation bar. Now, as a professional web developer, I'm not in favor of DHTML-supported, fancy navigation bars, but it was very fascinating. What they had done was, whenever you hovered your cursor over a link, a big, comics-type dialog balloon appeared to give further details of that link. I wondred how they did it, but then it slipped out of my mind.
That technique uses layers and Cascading Style Sheet definitions, and I'm going to tell you here, how it is done. Nothing pyrotechnic, but it'll pay a way to more complex tasks.
First, the demo. I believe once you visually see it, you'll understand better what I'm trying to accomplish here. Given below is a link. If you take your cursor over the link, an image appears somewhere on the screen. By tweaking you can control the placements. You can see the
demo, along with the online version of this article at:
http://www.bytesworth.com/learn/dhtml00001.asp
I've purposely made the image appear over a text area so that you don't think it is a simple rollover image effect. The image actually appears above the text.
Below lies the code that of the effect that appears above.
First the HTML part that defines the general link and the division that defines the placement of the image. Take note of the CSS definitions required to set the z-index and the "hide" attributes. Before testing the code, remember to remove the preceding dots that I have appended so that your email software doesn't read the code as some "process-able" content.
.Bring Your Cursor Here and See The Image
.
.
.
|
|
|
|
|
|
