Hi! Anyone can please to take a look at the below javascript and tell me what's wrong with it. It supposes to move words and pics to the center, and every 2 seconds when the browser loaded , a image will be swapped with the next image in the stack, totally 3 images. but I can't get it to work. just swap 2 images stack, not 2.
Ken
-----------Index.htm------------------------------
<html>
<head>
<title> Avalon Books</title>
<script language="JavaScript">
if (document.layers) location.href="avalon2.htm"
else if (document.all) location.href="avalon2.htm"
else if (document.getElementById) location.href="avalon2.htm"
</script>
</head>
<body style="background-color: black">
<p style="text-align: center">
<img src="ablogo.jpg" alt="Avalon Books" /><br />
<img src="ab.gif" alt="" />
</p>
</body>
</html>
------------------avalon2.htm-------------------------------
<html>
<head>
<title>Avalon Books</title>
<link href="styles2.css" rel="stylesheet" type="text/css" />
<script src="scripts2.
js" type="text/javascript"></script>
<script type="text/javascript">
W=winWidth()/2;
function placeObjects(){
placeIt("avalon",0,0);
placeIt("kids",W-75,100);
placeIt("fiction",W-75,100);
placeIt("nfiction",W-75,100);
setZ("kids",3);
setZ("fiction",2);
setZ("nfiction",1);
moveAvalon();
}
function moveAvalon() {
var x=xCoord("avalon");
if (x <= W-125) {
shiftIt("avalon",10,0);
setTimeout("moveAvalon()",50);
} else {
swapImages();
}
}
function swapImages() {
showIt("kids");
showIt("fiction");
showIt("nfiction");
setTimeout("swapIt('kids','fiction','nfiction')",2 000);
}
</script>
</head>
<body onLoad="placeObjects()">
<div id="kids">
<img src="kids.jpg" alt="" /><br />
Sale this month on children's books
</div>
<div id="fiction">
<img src="fiction.jpg" alt="" /><br />
Fiction selection of the month
</div>
<div id="nfiction">
<img src="nfiction.jpg" alt="" /><br />
Non-fiction selection of the month
</div>
<div id="avalon">
Avalon <span id="books">Books</span>
</div>
</body>
</html>
--------------scripts2.
js--------------------------
function placeIt(id, x, y) {
var object=document.getElementById(id);
object.style.left=x+"px";
object.style.top=y+"px";
}
function shiftIt(id, dx, dy) {
var object=document.getElementById(id);
object.style.left=parseInt(object.style.left)+dx+" px";
object.style.top=parseInt(object.style.top)+dy+"px ";
}
function xCoord(id) {
object=document.getElementById(id);
xc=parseInt(object.style.left);
return xc;
}
function showIt(id) {
var object=document.getElementById(id);
object.style.visibility="visible";
}
function winWidth() {
if (window.innerWidth) return window.innerWidth;
else if (document.documentElement) return document.documentElement.offsetWidth;
else if (document.body.clientWidth) return document.body.clientWidth;
}
function winHeight() {
if (window.innerHeight) return window.innerHeight;
else if (document.documentElement) return document.documentElement.offsetHeight;
else if (document.body.clientHeight) return document.body.clientHeight;
}
function setZ(id, z) {
var object=document.getElementById(id);
object.style.zIndex=z;
}
function swapIt(id1, id2, id3) {
var object1=document.getElementById(id1);
var object2=document.getElementById(id2);
var object3=document.getElementById(id3);
var z1=object1.style.zIndex;
var z2=object2.style.zIndex;
var z3=object3.style.zIndex;
object1.style.zIndex=z3;
object2.style.zIndex=z1;
object3.style.zIndex=z2;
}
___________________________________
christmas gift Audi A4 Clutch
dBforums
>
image swapping javascript (was "I need help! Please")
09-17-08, 12:05
Linear Mode
