David Nixon
New Member
Hello all,
I've added a rotating image on my site. I'm very new to webdesign, but battling through slowly. I was wondering if anybody can help me with adding some code to make the images rotate more smoothly. Maybe slide of fade. Not sure on your opinions.
Site: www.midlandsreptiles.com
JS:
<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();
// ---------------------------------------------------- Below is the code of the rotating javascript images---images are saved on a seperate midlandsreptiles page and linked---------
items[0]="<img alt='image0 (9K)' src='http://midlandsreptiles.com/Rotating_javascript.htm/1.jpg' height='290' width='432' border='1px' /></a>"; //a linked image
items[1]="<img alt='image1 (9K)' src='http://midlandsreptiles.com/Rotating_javascript.htm/2.jpg' height='290' width='432' border='0' /></a>"; //a linked image
items[2]="<img alt='image2 (9K)' src='http://midlandsreptiles.com/Rotating_javascript.htm/3.jpg' height='290' width='432' border='0' /></a>"; //a linked image
<!---------------------------------------------------------end of image link code---------------------------------->
function rotater() {
document.getElementById("placeholder").innerHTML = items[current];
current = (current==items.length-1) ? 0 : current + 1;
setTimeout("rotater()",howOften*1000);
}
function rotater() {
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
setTimeout("rotater()",howOften*1000);
}
window.onload=rotater;
//-->
</script>
The html:
<layer id="placeholderlayer"></layer><div id="placeholderdiv"></div>
Thanks in advance - please be basic with your answers
Dave
I've added a rotating image on my site. I'm very new to webdesign, but battling through slowly. I was wondering if anybody can help me with adding some code to make the images rotate more smoothly. Maybe slide of fade. Not sure on your opinions.
Site: www.midlandsreptiles.com
JS:
<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();
// ---------------------------------------------------- Below is the code of the rotating javascript images---images are saved on a seperate midlandsreptiles page and linked---------
items[0]="<img alt='image0 (9K)' src='http://midlandsreptiles.com/Rotating_javascript.htm/1.jpg' height='290' width='432' border='1px' /></a>"; //a linked image
items[1]="<img alt='image1 (9K)' src='http://midlandsreptiles.com/Rotating_javascript.htm/2.jpg' height='290' width='432' border='0' /></a>"; //a linked image
items[2]="<img alt='image2 (9K)' src='http://midlandsreptiles.com/Rotating_javascript.htm/3.jpg' height='290' width='432' border='0' /></a>"; //a linked image
<!---------------------------------------------------------end of image link code---------------------------------->
function rotater() {
document.getElementById("placeholder").innerHTML = items[current];
current = (current==items.length-1) ? 0 : current + 1;
setTimeout("rotater()",howOften*1000);
}
function rotater() {
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
setTimeout("rotater()",howOften*1000);
}
window.onload=rotater;
//-->
</script>
The html:
<layer id="placeholderlayer"></layer><div id="placeholderdiv"></div>
Thanks in advance - please be basic with your answers
Dave