Full version: jsB@nk » Image » One Picture Show
URL: https://www.javascriptbank.com/one-picture-show.html
Random image-split-effect enhancing the impact of your picture presentation. CROSSBROWSER. You need only one picture to achieve the effect. Navigator 4.x and Explorer 4.x
Full version: jsB@nk » Image » One Picture Show
URL: https://www.javascriptbank.com/one-picture-show.html
<SCRIPT><!-- Beginning of JavaScript -// One Picture Show// CONFIGURATION:// 1.Delete the DIV-container with the id 'deletethisdiv'. Then save//the HTML-file.// 2.Put your image in the same directory as the HTML-file. // 3.Insert 'onLoad="initiate()"' into the body-tag.// 4.Add the URL of your image into the 4 DIV-blocks with the id 'containerx' //just below the body-tag.// 5.Configure the varibales below:// The width of your image (pixels). var imgwidth=240// The height of your image (pixels).var imgheight=166// The horizontal and vertical position of the image (pixels). var pos_left=20var pos_top=20// Standstill-time (microseconds).var pause=2000// Speed var speed=200// Do not edit the script belowvar i_loop=0var max_loop=20var imgheightsmall=Math.round(imgheight/2)var imgwidthsmall=Math.round(imgwidth/2)var contentvar clipleftvar cliprightvar cliptopvar clipbottomvar xrangevar yrangefunction clipimage(obj,xclip,yclip) {if (document.all) {var thisobj=eval("document.all."+obj+".style")clipleft=xclipclipright=clipleft+imgwidthsmallcliptop=yclipclipbottom=cliptop+imgheightsmallthisobj.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"}if (document.layers) {var thisobj=eval("document."+obj)thisobj.clip.left=xclip thisobj.clip.right=xclip+imgwidthsmall thisobj.clip.top=yclip thisobj.clip.bottom=yclip+imgheightsmall}return}function initiate() {if (document.all) {document.all.container1.style.posLeft=pos_leftdocument.all.container1.style.posTop=pos_topclipimage("container1",0,0)document.all.container2.style.posLeft=pos_leftdocument.all.container2.style.posTop=pos_topclipimage("container2",imgwidthsmall,0)document.all.container3.style.posLeft=pos_leftdocument.all.container3.style.posTop=pos_topclipimage("container3",0,imgheightsmall)document.all.container4.style.posLeft=pos_leftdocument.all.container4.style.posTop=pos_topclipimage("container4",imgwidthsmall,imgheightsmall)var timer= setTimeout("imgrotate()",pause)}if (document.layers) {document.container1.left=pos_leftdocument.container1.top=pos_topclipimage("container1",0,0)document.container2.left=pos_leftdocument.container2.top=pos_topclipimage("container2",imgwidthsmall,0)document.container3.left=pos_leftdocument.container3.top=pos_topclipimage("container3",0,imgheightsmall)document.container4.left=pos_leftdocument.container4.top=pos_topclipimage("container4",imgwidthsmall,imgheightsmall)var timer= setTimeout("imgrotate()",pause)}}function randomposition() {xrange=Math.floor(imgwidthsmall*Math.random())yrange=Math.floor(imgheightsmall*Math.random())window.status=xrange+", "+yrangereturn}function imgrotate() {if(i_loop<=max_loop) {if (document.all) {randomposition()document.all.container1.style.posLeft=pos_left-xrangedocument.all.container1.style.posTop=pos_top-yrangeclipimage("container1",xrange,yrange)randomposition()document.all.container2.style.posLeft=pos_left+imgwidthsmall-xrangedocument.all.container2.style.posTop=pos_top-yrangeclipimage("container2",xrange,yrange)randomposition()document.all.container3.style.posLeft=pos_left-xrangedocument.all.container3.style.posTop=pos_top+imgheightsmall-yrangeclipimage("container3",xrange,yrange)randomposition()document.all.container4.style.posLeft=pos_left+imgwidthsmall-xrangedocument.all.container4.style.posTop=pos_top+imgheightsmall-yrangeclipimage("container4",xrange,yrange)}if (document.layers) {randomposition()document.container1.left=pos_left-xrangedocument.container1.top=pos_top-yrangeclipimage("container1",xrange,yrange)randomposition()document.container2.left=pos_left+imgwidthsmall-xrangedocument.container2.top=pos_top-yrangeclipimage("container2",xrange,yrange)randomposition()document.container3.left=pos_left-xrangedocument.container3.top=pos_top+imgheightsmall-yrangeclipimage("container3",xrange,yrange)randomposition()document.container4.left=pos_left+imgwidthsmall-xrangedocument.container4.top=pos_top+imgheightsmall-yrangeclipimage("container4",xrange,yrange)}i_loop++var timer= setTimeout("imgrotate()",speed)}else {i_loop=0var timer= setTimeout("initiate()",speed)}}// - End of JavaScript - --></SCRIPT><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><BODY onload=initiate()><DIV id=container1 style="POSITION: absolute; TOP: -2000px"><IMG src="pic191.jpg" width="240" height="166"></DIV><DIV id=container2 style="POSITION: absolute; TOP: -2000px"><IMG src="pic191.jpg" width="240" height="166"></DIV><DIV id=container3 style="POSITION: absolute; TOP: -2000px"><IMG src="pic191.jpg" width="240" height="166"></DIV><DIV id=container4 style="POSITION: absolute; TOP: -2000px"><IMG src="pic191.jpg" width="240" height="166"></DIV></BODY><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
http://javascriptbank.com/javascript/image/pic191.jpg