Special DHTML Image Mover MS Internet Explorer Browser

Professor Al Fichera

Web Page Design
Dynamic HTML Effects

MS Internet Explorer JavaScript Mover

IMAGE MOVER
You can animate any GIF or JPG you like, but be forewarned, keep it to about two or three otherwise you’ll put a burden on your users operating system. Not everyone has the fastest computer you know!

Highlight all the code in the textarea box below and paste it into the HEAD of your document. There is a JavaScript Source mentioned in this box, it’s code is in the fourth textarea box on this page. You will create a separate document with that code.

Highlight all the code in the textarea box below and paste it into the BODY TAG.

Highlight all the code in the textarea box below and paste it into the BODY of your document.

Lastly, highlight all the code in the textarea box below and create a new document that you will link to this page. You should name this new page moveobj.js, it is not an HTML page, it’s the JavaScript that allows this Dynamic HTML page to work. The linking code to this JavaScript is in the first textarea box on this page.

// Moving Objects Script // By Virtual_Max // // Permission to use, copy, modify, and distribute this software and its documentation // for NON-COMMERCIAL purposes and without fee is hereby granted provided that this // notice appears in all copies. // // VIRTUAL MAX MAKES NO REPRESENTATIONS OR WARRANTIES ABOUT THE SUITABILITY OF THE // SOFTWARE, EITHER EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE IMPLIED // WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE, OR // NON-INFRINGEMENT. VIRTUAL MAX SHALL NOT BE LIABLE FOR ANY DAMAGES SUFFERED BY // LICENSEE AS A RESULT OF USING, MODIFYING OR DISTRIBUTING THIS SOFTWARE OR // ITS DERIVATIVES. var brOK=false; var mie=false; var aver=parseInt(navigator.appVersion.substring(0,1)); var aname=navigator.appName; function checkbrOK() {if(aname.indexOf("Internet Explorer")!=-1) {if(aver>=4) brOK=navigator.javaEnabled(); mie=true; } if(aname.indexOf("Netscape")!=-1) {if(aver>=4) brOK=navigator.javaEnabled();} } var vmin=2; var vmax=5; var vr=2; var timer1; function Chip(chipname,width,height) {this.named=chipname; this.vx=vmin+vmax*Math.random(); this.vy=vmin+vmax*Math.random(); this.w=width; this.h=height; this.xx=0; this.yy=0; this.timer1=null; } function movechip(chipname) { if(brOK) {eval("chip="+chipname); if(!mie) {pageX=window.pageXOffset; pageW=window.innerWidth; pageY=window.pageYOffset; pageH=window.innerHeight; } else {pageX=window.document.body.scrollLeft; pageW=window.document.body.offsetWidth-8; pageY=window.document.body.scrollTop; pageH=window.document.body.offsetHeight; } chip.xx=chip.xx+chip.vx; chip.yy=chip.yy+chip.vy; chip.vx+=vr*(Math.random()-0.5); chip.vy+=vr*(Math.random()-0.5); if(chip.vx>(vmax+vmin)) chip.vx=(vmax+vmin)*2-chip.vx; if(chip.vx<(-vmax-vmin)) chip.vx=(-vmax-vmin)*2-chip.vx; if(chip.vy>(vmax+vmin)) chip.vy=(vmax+vmin)*2-chip.vy; if(chip.vy<(-vmax-vmin)) chip.vy=(-vmax-vmin)*2-chip.vy; if(chip.xx<=pageX) {chip.xx=pageX; chip.vx=vmin+vmax*Math.random(); } if(chip.xx>=pageX+pageW-chip.w) {chip.xx=pageX+pageW-chip.w; chip.vx=-vmin-vmax*Math.random(); } if(chip.yy<=pageY) {chip.yy=pageY; chip.vy=vmin+vmax*Math.random(); } if(chip.yy>=pageY+pageH-chip.h) {chip.yy=pageY+pageH-chip.h; chip.vy=-vmin-vmax*Math.random(); } if(!mie) {eval('document.'+chip.named+'.top ='+chip.yy); eval('document.'+chip.named+'.left='+chip.xx); } else {eval('document.all.'+chip.named+'.style.pixelLeft='+chip.xx); eval('document.all.'+chip.named+'.style.pixelTop ='+chip.yy); } chip.timer1=setTimeout("movechip('"+chip.named+"')",100); } } function stopme(chipname) {if(brOK) {//alert(chipname) eval("chip="+chipname); if(chip.timer1!=null) {clearTimeout(chip.timer1)} } }

Return to Profal2 Miscellaneous DHTML