Download presentation
Presentation is loading. Please wait.
1
Hover Button Hover button Rename any two pictures in C:/100/pics to
pic1.jpg and pic2.jpg pic1.jpg and pic2.jpg have to be at C:\100\pics folder your html file in C:\100 folder Type the codes below within <body> part of the html file (re-type it because of different coding of quotation marks) <img src=“pics/pic1.jpg” alt=”pics” style="border-style:none” onmouseover="this.src = ’pics/pic2.jpg’” onmouseout = “this.src = ‘pics/pic1.jpg’” >
2
Rotating Banner Tutorial on Javascript Rotating banners
Rotating banners Insert codes in the next slide for header In the <body>, insert the following code where you want the rotating banner <layer id="placeholderlayer"></layer><div id="placeholderdiv"></div>
3
<header> <script language="JavaScript1.2"> var howOften = 5; //number often in seconds to rotate var current = 0; //start the counter at 0 var ns6 = document.getElementById&&!document.all; //detect netscape 6 // place your images, text, etc in the array elements here var items = new Array(); items[0]="<a href='link.htm' ><img alt='image0 (9K)' src='pics/pic1.jpg' height='300' width='300' border='0' /></a>"; //a linked image items[1]="<a href='link.htm'><img alt='image1 (9K)' src='pics/pic2.jpg' height='300' width='300' border='0' /></a>"; //a linked image function rotater() { document.getElementById("placeholder").innerHTML = items[current]; current = (current==items.length-1) ? 0 : current + 1; setTimeout("rotater()",howOften*100); } if(document.layers) { document.placeholderlayer.document.write(items[current]); document.placeholderlayer.document.close(); if(ns6)document.getElementById("placeholderdiv").innerHTML=items[current] if(document.all) placeholderdiv.innerHTML=items[current]; current = (current==items.length-1) ? 0 : current + 1; //increment or reset window.onload=rotater; //--> </script> </header>
4
Bird Walk Download www.cs.uml.edu/~kim/100/birdwalk.html
Save to your C:\100 If you do not have "b_plover.gif" picture, you have to download it from Open birdwalk.html in the Notepad View the source code, and see if you can change the background and the banner pictures.
Similar presentations
![Working with Forms. how are forms manipulated? the document object contains an array of forms objects, one for each form, in document order –forms[] any.](/3/783151/big_thumb.jpg "Working with Forms. how are forms manipulated? the document object contains an array of forms objects, one for each form, in document order –forms[] any.>")
