You are here: irt.org | FAQ | DHTML | Q1297 [ previous next ]
The following uses layers to produce a slide show that will work in Netscape Navigator 4 and Internet Explorer 4 and Internet Explorer 5:
<style type="text/css"><!-- .hidden { position: absolute; visibility: hidden; } .visible { position: absolute; visibility: visible; } //--></style> <script type="text/javascript" language="JavaScript"><!-- function set(What,Value) { if (document.layers && document.layers[What] != null) document.layers[What].visibility = Value; else if (document.all) document.all[What].style.visibility = Value; } var layers = 5; var layer = 1; function next() { if (layer < layers) { set('myLayer' + layer,'hidden'); set('myLayer' + (++layer),'visible'); } } function prev() { if (layer > 1) { set('myLayer' + layer,'hidden'); set('myLayer' + (--layer),'visible'); } } //--></script> <form> <input type="button" value="prev" onClick="prev()"> <input type="button" value="next" onClick="next()"> </form> <span name="myLayer1" class="visible"> Slide 1 </span> <span name="myLayer2" class="hidden"> Slide 2 </span> <span name="myLayer3" class="hidden"> Slide 3 </span> <span name="myLayer4" class="hidden"> Slide 4 </span> <span name="myLayer5" class="hidden"> Slide 5 </span>