Anima

<script type="text/javascript" language="javascript1.2">' leftrightslide[1]='' leftrightslide[2]='' leftrightslide[3]='' leftrightslide[4]='' leftrightslide[5]='' leftrightslide[6]='' leftrightslide[7]='' leftrightslide[8]='' leftrightslide[9]='' leftrightslide[10]='' var copyspeed=slidespeed leftrightslide='<nobr>'+leftrightslide.join()+'' var iedom=document.all||document.getelementbyid if (iedom) document.write('<span id="temp" style="visibility:hidden;position:absolute;top:100;left:-600">'+leftrightslide+'') var actualwidth='' var cross_slide, ns_slide function fillup(){ if (iedom){ cross_slide=document.getelementbyid? document.getelementbyid("test2") : document.all.test2 cross_slide2=document.getelementbyid? document.getelementbyid("test3") : document.all.test3 cross_slide.innerhtml=cross_slide2.innerhtml=leftrightslide actualwidth=document.all? cross_slide.offsetwidth : document.getelementbyid("temp").offsetwidth cross_slide2.style.left=actualwidth+20 }

else if (document.layers){ ns_slide=document.ns_slidemenu.document.ns_slidemenu2 ns_slide2=document.ns_slidemenu.document.ns_slidemenu3 ns_slide.document.write(leftrightslide) ns_slide.document.close() actualwidth=ns_slide.document.width ns_slide2.left=actualwidth+20 ns_slide2.document.write(leftrightslide) ns_slide2.document.close() } lefttime=setinterval("slideleft()",30) } window.onload=fillup function slideleft(){ if (iedom){ if (parseint(cross_slide.style.left)>(actualwidth*(-1)+8)) cross_slide.style.left=parseint(cross_slide.style.left)-copyspeed else cross_slide.style.left=parseint(cross_slide2.style.left)+actualwidth+30 if (parseint(cross_slide2.style.left)>(actualwidth*(-1)+8)) cross_slide2.style.left=parseint(cross_slide2.style.left)-copyspeed else cross_slide2.style.left=parseint(cross_slide.style.left)+actualwidth+30 } else if (document.layers){ if (ns_slide.left>(actualwidth*(-1)+8)) ns_slide.left-=copyspeed else ns_slide.left=ns_slide2.left+actualwidth+30 if (ns_slide2.left>(actualwidth*(-1)+8)) ns_slide2.left-=copyspeed else ns_slide2.left=ns_slide.left+actualwidth+30 } } if (iedom||document.layers){ with (document){ document.write('

') if (iedom){ write(' ') write(' ') write(' ') write(' ') write(' ') } else if (document.layers){ write('') write('') write('') write('') } document.write('

') } } //-->

-----------------------------------------------------------------------------------------2 example insert between head tags: <script> // your images. you may add as many images as you like. var imgname=new array("clock2","girl201","banner") // your images width. you may add as many images as you like. var imgw=new array("110","480","232") // your images height. you may add as many images as you like. var imgh=new array("208","280","73") //place your pictures page here. the pound symbol allows the use of the anchor name feature. //so that the image can be brought forward when clicked on. var imgurl="pics.html#" //this array preloads the images so that they rotate at the proper speed on the page. var imgpreload=new array() for (i=0;i<=imgname.length-1;i++) {

}

imgpreload[i]=new image() imgpreload[i].src=imgname[i]

//declare any needed variables here. var i_image=0 //i_image is used for the array of images to be accessed later. var screenheight=0 //screenheight is for usable height of the display area ie 567px if your height is 600px var screenwidth=0 //screenwidth is for the usable width of the display area ie 800px if your width is 800px var x_finalpos=0 //x_finalpos is for the final position when placing the image on the screen in the scroller. var y_finalpos=0 //y_finalpos is for the final position when placing the image on the screen in the scroller. var imgheight=0 //used to calculate the final position of the image in the scroller you load the image height here. var imgwidth=0 //used to calculate the final position of the image in the scroller you load the image width here. /*this function finds the location on the screen for the image scroller. it does this by calculating the screen height and width that is usable then dividing this by 2 so that the image will center. it then subtracts half of the image from the usable height and width of the screen and adds 20 to the height for placement purposes.*/ function picturepos() { imgheight=imgh[i] imgwidth=imgw[i] x_finalpos=((document.body.clientheight/2)-(imgheight/2)+20) y_finalpos=((document.body.clientwidth/2)-(imgwidth/2)) } //this function sets the timer on the image roller.and calls another function to roll the image function initiate() { var timer=setinterval("swapimg()",2000) } //this function provides the names of the images that are being used by the roller. function swapimg(){ eval("document.all.div"+i_image+".style.display='none'") if (i_image++>imgname.length-2) {i_image=0} eval("document.all.div"+i_image+".style.display=''") return(false) } <script> if (document.all) { for (i=0;i<=imgname.length-1;i++) { picturepos() document.write("") } } insert into body tag: onload='initiate()' ----------------------------------------------------------------------------------- <script type="text/javascript" src="records.js"> <script type="text/javascript">" + arrecord[currecord][i] + ""); close(); } } else { whichel = eval("document.all.elfield" + i); whichel.innerhtml = "" + arrecord[currecord][i] + ""; } } }

function shownext() { currecord = (currecord < maxrecords) ? ++currecord : 1; update(); } function showprev() { currecord = (currecord > 1) ? --currecord : maxrecords; update(); }

//-->


onload="update()" ------------------------------------------------------ <script type="text/javascript">
next1.src = "next1.jpg"; next2 = new image (32,18); next2.src = "next2.jpg"; go1 = new go1.src = go2 = new go2.src =

image (48,24); "go1.jpg"; image (48,24); "go2.jpg";

maxpic = 5; p1 = new image (144,96); p1.src = "http://jdstiles.com/pic/chair.jpg"; link1 = "http://jdstiles.com/pic/chair.jpg"; p2 = new image (144,96); p2.src = "http://jdstiles.com/pic/ling.jpg"; link2 = "http://jdstiles.com/pic/ling.jpg"; p3 = new image (144,96); p3.src = "http://jdstiles.com/pic/tazz.jpg"; link3 = "http://jdstiles.com/pic/tazz.jpg"; p4 = new image (144,96); p4.src = "http://jdstiles.com/pic/chair.jpg"; link4 = "http://jdstiles.com/pic/chair.jpg"; p5 = new image (144,96); p5.src = "http://jdstiles.com/pic/wall.jpg"; link5 = "http://jdstiles.com/pic/wall.jpg"; count = 1; function next() { count++; if (count > maxpic) { count = 1; } eval("document.p.src=p" + count + ".src"); } function back() { count--; if (count == 0) { count = maxpic; } eval("document.p.src=p" + count + ".src"); } function link() { location.href=eval("link" + count); } // end -->

thumbnail navigator browse to a picture you like and click "go".

-------------------------------------------------------------------insert inside body:

<script type="text/javascript"> // credits: // random order slideshow with messages // concept by urs dudli and peter gehrig // rewritten for this site by jim stiles www.jdstiles.com /////////////////////////////////////////////////////////////////////////// // configuration starts here /////////////////////////////////////////////////////////////////////////// // replace the urls of the slides and the corresponding messages. // please note that the url and the correponding message are separated by "|". // watch how the "," and the " " are set! // you may add as many slides as you like. // important: do not use the return-key to break the lines!!! var slideshow=new array("http://jdstiles.com/pic/centerpug.jpg|a young tazz.","http://jdstiles.com/pic/chair.jpg|relaxing on the weekend!","http://jdstiles.com/pic/floor.jpg|here\'s looking at you.","http://jdstiles.com/pic/wall.jpg|getting some sun.","http://jdstiles.com/pic/tazz.jpg|this is my throne!","http://jdstiles.com/pic/rug.jpg|watching television.","http://jdstiles.com/pic/ling.jpg|i run this household.","http://jdstiles.com/pic/bed.jpg|is it time for bed yet?","http://jdstiles.com/pic/basket.jpg|hey... this is pretty comfortable!") // the font-family of the messages var fntfamily="verdana" // the font-size of the messages (ranging from 1 to 6) var fntsize=2 // the font-color of the messages // instead of "yellow" you also could write "ffff00" var fntcolor="f5deb5" // the background-color of the messages // instead of "black" you also could write "000000"

var bgrndcolor="8b0000" // the width of the slides (pixels) var imagewidth=250 // the height of the slides (pixels) var imageheight=250 // the minimum interval between each slide (seconds) var standstill=4 /////////////////////////////////////////////////////////////////////////// // configuration ends here /////////////////////////////////////////////////////////////////////////// // do not change the code below var imgstop=0 var imgsleft=0 var mestop=imageheight var mesleft=0 var firstslide=true var starttime var nowtime var imgurl=new array() var message=new array() var imgurlandmessagearray=new array() var imgurlandmessage var imgpreload=new array() var playertop=0 var playerleft=0 var i_imgs=0 var i_loop=0 var i_preloadloop=0 var i_transition=0 var timerrotate=false var timercheck=false var contentimg var contentmes var slideshowlength=slideshow.length var topdivheight=imageheight+40 var ns6=document.getelementbyid&&!document.all?1:0 var standstill=standstill*1000 function init() { firstslide=true i_imgs=0 i_loop=0 i_preloadloop=randommaker(slideshowlength) if (timerrotate) { cleartimeout(timerrotate) cleartimeout(timercheck) } imgurl=new array message=new array for (i=0;i<=slideshow.length-1;i++) { imgurlandmessage=slideshow[i].split("|")

}

imgurl[i]=imgurlandmessage[0] message[i]=imgurlandmessage[1]

if (document.all) { imgs.innerhtml="" mes.innerhtml="" document.all.imgs.style.postop=imgstop document.all.imgs.style.posleft=imgsleft document.all.mes.style.postop=mestop document.all.mes.style.posleft=mesleft checkpreloadtime() preloadimage() checkifloaded() } if (ns6) { document.getelementbyid('imgs').innerhtml="" document.getelementbyid('mes').innerhtml="" document.getelementbyid('imgs').style.top=imgstop document.getelementbyid('imgs').style.left=imgsleft document.getelementbyid('mes').style.top=mestop document.getelementbyid('mes').style.left=mesleft checkpreloadtime() preloadimage() checkifloaded() } if (document.layers) { document.topdiv.document.imgs.document.write("") document.topdiv.document.imgs.document.close() document.topdiv.document.mes.document.write("") document.topdiv.document.mes.document.close() document.topdiv.document.imgs.top=imgstop document.topdiv.document.imgs.left=imgsleft document.topdiv.document.mes.top=mestop document.topdiv.document.mes.left=mesleft checkpreloadtime() preloadimage() checkifloaded() } } function checkifloaded() { if (imgpreload.complete) { nowtime=new date() nowtime=nowtime.gettime() nowtime=nowtime-starttime var interval=standstill-nowtime if (interval<=0 ) { interval=1 } if (firstslide) { interval=1 firstslide=false } if (i_preloadloop==i_loop) { interval=1 } timerrotate=settimeout("rotateimages()", interval)

}

} else { timercheck=settimeout("checkifloaded()", 100) }

function preloadimage() { imgpreload=new image() imgpreload.src=imgurl[i_preloadloop] } function rotateimages() { i_loop=i_preloadloop i_preloadloop=randommaker() checkpreloadtime() preloadimage() getcontent() if (document.all) { imgs.filters[i_transition].apply() imgs.innerhtml=contentimg imgs.filters[i_transition].play() i_transition++ if (i_transition>21) {i_transition=0} mes.innerhtml=contentmes } if (ns6) { document.getelementbyid('imgs').innerhtml=contentimg document.getelementbyid('mes').innerhtml=contentmes } if (document.layers) { document.topdiv.document.imgs.document.write(contentimg) document.topdiv.document.imgs.document.close() document.topdiv.document.mes.document.write(contentmes) document.topdiv.document.mes.document.close() } i_loop++ checkifloaded() } function randommaker() { rand=math.floor(slideshowlength*math.random()) return rand } function getcontent() { contentimg="" contentmes="

"+message[i_loop]+"

" } if (document.all) { document.write('

---

Related Documents