« »

$Dodge \'Em-Racing Car 2$ Avoid the other cars as you drive down the road.

Label: Dodge 'Em-Racing Car 2

Demo
Enlarge
Reload
New window

Code
Files
CSS
JavaScript
HTML
Print

Dodge_em2_images.zip

Copy All x2

<style>
.bckgnd {position:absolute; visibility:visible; left:0px; top:-300px; z-index:1; width:500px; height:250px}
.driver {position:absolute; visibility:visible; left:0px; top:-300px; z-index:10; width:90px; height:59px;}
.obj    {position:absolute; visibility:visible; left:0px; top:-300px; z-index:2; width:90px; height:59px;}
.crash  {position:absolute; visibility:visible; left:0px; top:-300px; z-index:100; width:90px; height:59px;}

body{
background-color:white;
font-size:10pt;
font-family:sans-serif;
color:#00436e;
}

</style>
	<!--
    	This script downloaded from www.JavaScriptBank.com
    	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
	-->

Copy All x2

<script language="javascript">

var yoffset=60;

var w3c=(document.getElementById)?true:false;
var ns4=(document.layers)?true:false;
var ie4=(document.all && !w3c)?true:false;
var ie5=(document.all && w3c)?true:false;
var ns6=(w3c && navigator.appName.indexOf("Netscape")>=0)?true:false;
var speed=300, hitcount=1, randcar=0, oktoanimate=true, oktotestcrash=true, okmouse=true;
var car, road, crash, xcntr,aid=0;
var drive=new Array();
var ycoords=[47,58,68,83,99,122,144,172,200];
var xcoords=[ [-57,-25,5,37], [-67,-31,5,42], [-78,-36,6,48], [-91,-43,6,57], [-105,-50,6,64], [-126,-60,6,74], [-148,-70,6,84], [-171,-80,7,97], [-194,-91,7,112] ];
var cararray=[[0,0],[0,0],[0,0],[0,0],[0,0],[0,0],[0,0],[0,0],[0,0]];
var carimages=new Array();
for(p=1;p<=4;p++){
carimages[p]=new Image();
carimages[p].src='drive'+p+'.gif';
}

function animate(){
if(oktoanimate){
randcar++;
for(j=8;j>0;j--)cararray[j]=cararray[j-1];
if(randcar==3){
randcar=0;
cararray[0]=[Math.floor(Math.random()*4) , Math.floor(Math.random()*4)+1];
}else cararray[0]=[0,0];
for(y=1;y<=9;y++){
var yc=(cararray[y-1][1]==0)? -100-yoffset : ycoords[y-1];
moveidto( drive[y], xcoords[y-1][cararray[y-1][0]] , yc);
if(ns4)drive[y].document.images['p'+y].src='drive'+cararray[y-1][1]+'.gif';
else document.images['p'+y].src='drive'+cararray[y-1][1]+'.gif';
}
if(speed>=80)speed-=.75;
aid=setTimeout('animate()', speed);
}}


function testcrash(){
if(oktotestcrash){
var carx=(ns4)? car.left-xcntr : parseInt(car.style.left)-xcntr;
var p8=cararray[8][0];
var p7=cararray[7][0];
if( ((cararray[7][1]!=0)&&(carx<=xcoords[8][p7]+80)&&(carx>=xcoords[8][p7]-80)) || ((cararray[8][1]!=0)&&(carx<=xcoords[8][p8]+80)&&(carx>=xcoords[8][p8]-80))) {
oktotestcrash=false;
okmouse=false;
oktoanimate=false;
if(ns4)crash.moveTo(car.left,car.top-40);
else{
crash.style.top=parseInt(car.style.top)-40+'px';
crash.style.left=car.style.left;
}
status='You\'ve crashed '+(hitcount++)+' times.';
setTimeout('okmouse=true',1000);
setTimeout('resume()',1500);
}else setTimeout('testcrash()',80);
}}

function resume(){
(ns4)?crash.top=-100 : crash.style.top=-100+'px';
if(cararray[8] != [0,0]){
(ns4)?drive[1].top=-100 : drive[1].style.top=-100+'px';
cararray[8]=[0,0];
}
if(cararray[7] != [0,0]){
(ns4)?drive[2].top=-100 : drive[2].style.top=-100+'px';
cararray[7]=[0,0];
}
okmouse=true;
oktoanimate=true;
oktotestcrash=true;
animate();
testcrash();
}

function moveidto(id,x,y){
if(ns4)id.moveTo(x+xcntr,y+yoffset);
else{
id.style.left=x+xcntr+'px';
id.style.top=y+yoffset+'px';
}}

function trckmse(evt){
cx=(ie4||ie5)? event.clientX:evt.pageX;
if((cx<=xcntr+164)&&(cx>=xcntr-156)&&okmouse)moveidto(car, cx-47-xcntr, 200);
return false;
}

function resize(){
xcntr=(ie4||ie5)? document.body.clientWidth:window.innerWidth;
var wh=(ie4||ie5)? document.body.clientHeight:window.innerHeight;
if((wh<450) || (xcntr<600))window.resizeTo(620,470);
xcntr=xcntr/2;
moveidto(car, 0, 200);
moveidto(road, -250, 0);
}

function getid(id){
if(ns4) return findlayer(id,document);
else if(ie4)return document.all[id];
else return document.getElementById(id);
}

// FUNCTION TO FIND NESTED LAYERS IN NS4 BY MIKE HALL
function findlayer(name,doc){
var i,layer;
for(i=0;i<doc.layers.length;i++){
layer=doc.layers[i];
if(layer.name==name)return layer;
if(layer.document.layers.length>0)if((layer=findlayer(name,layer.document))!=null)return layer;
}
return null;
}

function getkeypress(keypress){
keyp=(ie4||ie5)? event.keyCode:keypress.which;
if(keyp==112){
oktoanimate=false;
clearTimeout(aid);
alert('Game Paused....\n\nPress "OK" to continue.');
oktoanimate=true;
animate();
}
return false;
}

window.onresize=function(){
if(ns4)setTimeout('history.go(0)',400);
else resize();
}

window.onload=function(){
for(i=1;i<=36;i++)drive[i]=getid('drive'+i);
car=getid('car');
road=getid('road');
crash=getid('crash');
if(ns4)document.captureEvents(Event.MOUSEMOVE | Event.KEYPRESS);
document.onmousemove=trckmse;
document.onkeypress=getkeypress;
resize();
alert('INSTRUCTIONS:\n\n- Use the mouse to navigate the car around other cars.\n- Press "P" to pause the game.\n\nPress "Ok" when ready...');
status="You\'ve crashed 0 times";
animate();
testcrash();
}

</script>
	<!--
    	This script downloaded from www.JavaScriptBank.com
    	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
	-->

Copy All x2

<div id="road" class="bckgnd"><img src="road.gif" border="3"></div>
<div id="crash" class="crash"><img src="crash.gif"></div>
<div id="car" class="driver"><img src="car.gif" border="0"></div>
<div id="drive1" class="obj"><img src="drive0.gif" width="28" height="18" name="p1"></div>
<div id="drive2" class="obj"><img src="drive0.gif" width="33" height="21" name="p2"></div>
<div id="drive3" class="obj"><img src="drive0.gif" width="38" height="25" name="p3"></div>
<div id="drive4" class="obj"><img src="drive0.gif" width="44" height="29" name="p4"></div>
<div id="drive5" class="obj"><img src="drive0.gif" width="50" height="33" name="p5"></div>
<div id="drive6" class="obj"><img src="drive0.gif" width="61" height="40" name="p6"></div>
<div id="drive7" class="obj"><img src="drive0.gif" width="72" height="47" name="p7"></div>
<div id="drive8" class="obj"><img src="drive0.gif" width="81" height="53" name="p8"></div>
<div id="drive9" class="obj"><img src="drive0.gif" width="90" height="59" name="p9"></div>
	<!--
    	This script downloaded from www.JavaScriptBank.com
    	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
	-->