Browse DevX
Sign up for e-mail newsletters from DevX

Tip of the Day
Language: Web
Expertise: Advanced
Jul 10, 2000



Building the Right Environment to Support AI, Machine Learning and Deep Learning

Dynamically Changing Content without DHTML

The DHTML capabilities (such as changing the text color/fonts/size dynamically) are very nice features to have, but unfortunately, they are not available on all browser applications. Essentially, DHTML features work only on the Internet Explorer Web browser. This example explains how to achieve dynamic features within a normal HTML document even on browsers like Netscape Navigator. The method explained here makes use of the 'innerHTML' property of the <div> objects in the Internet Explorer and the 'layer' objects in Netscape Compatible browsers.

The example below explains how to use the <layer> in conjunction with the <div> tags:

<form name="myForm">
<input type="button" value="Make me Red & Bold" 
<div id="myLayer">
<layer name="myLayer">
I am a normal text

The following JavaScript method is called on by clicking the form button (changing the contents could happen on any other event like onmousemove, onmouseout etc.).

<script language="JavaScript">
function changeFont() {
textTag="<font color=red><b>
I am Red & Bolder now!</b></font>";

if (document.all)
document.all.myLayer.innerHTML = textTag;
else if (document.layers) {
obj = document.layers["myLayer"].document.open();

Here the Internet Explorer makes use of the <div> tags, whereas Netscape Navigator makes use of the 'layer' object to dynamically change its content. Using this method and a little bit of imagination, you can add some 'dynamism' to your Web pages on any browser.

Ajith Prasad
Comment and Contribute






(Maximum characters: 1200). You have 1200 characters left.



Thanks for your registration, follow us on our social networks to keep up-to-date