DHTML Lesson 3 - Moving on to Internet Explorer

DHTML Lesson 3 ’ Moving On to Internet Explorer

Now that you are familiar with how to call dynamic functions within Netscape 4.0, it is time to move to Internet Explorer 4.0 so you can really take advantage of some advanced features. Internet Explorer 4.0 does not rely on one simple tag, like Netscape, which uses only the tag to display DHTML.

This means that you will be able to do more with DHTML in Internet Explorer, as we will show in this tutorial. As you are learning the basics of DHTML in Internet Explorer, we will be showing you how to add mouseovers at the same time.

First, you will need to learn the basics of calling DHTML within your HTML page for Internet Explorer. This is where it gets a little more complicated. You will be using your existing html code, but assigning dynamic attributes to it.

For example, we will use a simple mouseover effect on text.

lesson 3

You will see that there are some similarities to the layer tag, such as being able to assign an ID to an effect, in this case “sampletext.” This ID is then called up when you want to apply the mouseover effect, such as “sampletext.style.color.”

You can also see that the colors need to have a single ‘blue’ quote mark inside this tag, as opposed to the “blue” normal quotation marks that you are used to. This is because the entire tag is read as one command, instead of being read separately.

When you use the above code on your page, the “Here is our sample Mouseover” text will first appear in green. As soon as you hold your mouse over this string of text however, its color will change to blue.

The style element is where you will put in what you want the browser to do. You could use different styles, such as font size or face, instead of color.

Try experimenting with different colors, sizes and faces on your page as you learn more about how Internet Explorer reacts with DHTML. You can also use this effect on images. You will need to have both images loaded on to your server, the original, and the one that will display when the mouse is held over the original.

Our next tutorial will cover how to create DHTML that can be seen in both Netscape and Internet Explorer, which will save you the time of having to create every page twice while using DHTML.

Related Posts:
DHTML Lesson 4 - Cross Browser DHTML
DHTML Lesson 5 ‘ A Cross Browser Scrollbar
DHTML Lesson 1 - The Basics
DHTML Lesson 2 - Continuing the Basics
Java Script Lesson 9 ‘ Adding a Slideshow

Posted on 12/27/05 1:34 AM

Be the first to comment!

Leave a Reply


SYNDICATION

    NEW! Blog Feed:
    Reviews Feed:
    News Feed:
    Resources Feed: