13-6.htm

JavaScript网页特效实例大全

<SCRIPT LANGUAGE="JavaScript">
function browser_check()
{
var browser = document.all;
}
var pic = "crab.gif";                                      <!--设置图片变量-->
var mask = '<IMG SRC="' + pic + '">';                    <!--设置图片地址变量-->
var fancy, stake, level, winner;                         <!--设置参数变量-->
var total = 10000;                                          <!--设置得分变量-->
var running = 0;                                             <!--设置开始变量-->
var stopped = 1;                                             <!--设置停止变量-->
var odds  = new Array();
var step  = new Array();
var band='<TABLE BORDER=1 BORDERCOLOR=#000000 WIDTH=300 HEIGHT=160 ALIGN=CENTER CELLPADDING=0 CELLSPACING=0><FORM NAME="f"><TR>';
band += '<TD COLSPAN=4 BGCOLOR=#C0C0C0 ALIGN=CENTER VALIGN=MIDDLE><INPUT TYPE=TEXT NAME="msg" SIZE=24 VALUE="" ></TD></TR><TR>';
<!--设置螃蟹图片样式-->
band += '<TD BGCOLOR=#FF0000 ALIGN=CENTER VALIGN=MIDDLE><INPUT TYPE=TEXT  NAME="box0" SIZE=3 VALUE="" onfocus="blur(this)"><BR><INPUT TYPE=RADIO NAME="back" VALUE="红色" onclick="choose_fancy(this.form,this.value);"></TD>';
<!--设置螃蟹图片样式-->
band += '<TD BGCOLOR=#00FF00 ALIGN=CENTER VALIGN=MIDDLE><INPUT TYPE=TEXT  NAME="box1" SIZE=3 VALUE="" onfocus="blur(this)"><BR><INPUT TYPE=RADIO NAME="back" VALUE="绿色" onclick="choose_fancy(this.form,this.value);"></TD>';
<!--设置螃蟹图片样式-->
band += '<TD BGCOLOR=#0000FF ALIGN=CENTER VALIGN=MIDDLE><INPUT TYPE=TEXT  NAME="box2" SIZE=3 VALUE="" onfocus="blur(this)"><BR><INPUT TYPE=RADIO NAME="back" VALUE="蓝色" onclick="choose_fancy(this.form,this.value);"></TD>';
<!--设置螃蟹图片样式-->
band += '<TD BGCOLOR=#FFF000 ALIGN=CENTER VALIGN=MIDDLE><INPUT TYPE=TEXT  NAME="box3" SIZE=3 VALUE="" onfocus="blur(this)"><BR><INPUT TYPE=RADIO NAME="back" VALUE="黄色" onclick="choose_fancy(this.form,this.value);"></TD></TR><TR>';
<!--设置按钮样式-->
band += '<TD BGCOLOR=#C0C0C0 ALIGN=CENTER VALIGN=MIDDLE><INPUT TYPE=BUTTON VALUE=" 1000 " onclick="choose_stake(this.form,this.value);"></TD>';
<!--设置按钮样式-->
band += '<TD BGCOLOR=#C0C0C0 ALIGN=CENTER VALIGN=MIDDLE><INPUT TYPE=BUTTON VALUE=" 2000 " onclick="choose_stake(this.form,this.value);"></TD>';
<!--设置按钮样式-->
band += '<TD BGCOLOR=#C0C0C0 ALIGN=CENTER VALIGN=MIDDLE><INPUT TYPE=BUTTON VALUE=" 3000 " onclick="choose_stake(this.form,this.value);"></TD>';
<!--设置按钮样式-->
band += '<TD BGCOLOR=#C0C0C0 ALIGN=CENTER VALIGN=MIDDLE><INPUT TYPE=BUTTON VALUE=" 4000 " onclick="choose_stake(this.form,this.value);"></TD></TR><TR>';
<!--设置按钮样式-->
band += '<TD BGCOLOR=#C0C0C0 ALIGN=CENTER VALIGN=MIDDLE><INPUT TYPE=BUTTON NAME="go" VALUE="开始" onclick="lets_go(this.form);"></TD>';
<!--设置按钮样式-->
band += '<TD BGCOLOR=#C0C0C0 ALIGN=CENTER VALIGN=MIDDLE><INPUT NAME="wlt" TYPE=TEXT SIZE=5 VALUE='+total+' onfocus="blur(this)"></TD>';
<!--设置按钮样式-->
band += '<TD COLSPAN=2 BGCOLOR=#C0C0C0 ALIGN=CENTER VALIGN=MIDDLE><INPUT TYPE=BUTTON NAME="next" VALUE="再来一次" onclick="init();"></TD></TR></FORM></TABLE>';
if(document.all)
{
var content=('<DIV ID="trak" STYLE="position:absolute; top: 20; left:20; width:300; height:100; background:#000000;"></DIV>');
content += ('<DIV ID="line" STYLE="position:absolute; top: 20; left:287;width: 1; height:100; background:#FFFFFF;"></DIV>');
content += ('<DIV ID="book" STYLE="position:absolute; top:120; left:20; width:300; height:160; background:#C0C0C0;">'+band+'</DIV>');
content += ('<DIV ID="redc" STYLE="position:absolute; top: 23; left:20; width: 31; height: 22; background:#FF0000;">'+mask+'</DIV>');
content  += ('<DIV ID="grnc" STYLE="position:absolute; top: 47; left:20; width: 31; height: 22; background:#00FF00;">'+mask+'</DIV>');
content  += ('<DIV ID="bluc" STYLE="position:absolute; top: 71; left:20; width: 31; height: 22; background:#0000FF;">'+mask+'</DIV>');
content  += ('<DIV ID="yelc" STYLE="position:absolute; top: 96; left:20; width: 31; height: 22; background:#FFF000;">'+mask+'</DIV>');
}
document.write(content);
init();
function init()
{
if(!running)
{
fancy="";
stake="";
level="";
stopped = 0;
for(i=0; i<4; i++)
{
odds[i] = Math.round(Math.random() * 3)+1;
step[i] = eval(10 - odds[i]);
odds[i] +="/1";
}
if(document.all)
{
document.all.msg.value = "赌赌哪只螃蟹会赢？"
document.all.box0.value = odds[0];
document.all.box1.value = odds[1];
document.all.box2.value = odds[2];
document.all.box3.value = odds[3];
for(i=0; i<4; i++)
{
document.all.back[i].checked=0;
}
document.all.redc.style.left=20;
document.all.grnc.style.left=20;
document.all.bluc.style.left=20;
document.all.yelc.style.left=20;
}
}
}
function choose_fancy(f,color)
{
if(!running)
{
switch(color)
{
case "红色"    : level=odds[0]; break;
case "绿色"  : level=odds[1]; break;
case "蓝色"   : level=odds[2]; break;
case "黄色" : level=odds[3]; break;
}
fancy = color;
if(stake != "") f.msg.value="下注："+fancy+" "+stake+" ("+level+")";
else f.msg.value= "选择"+fancy;
}
}
function choose_stake(f,amount)
{
if(!running)
{
stake = amount;
if(fancy != "") f.msg.value="下注："+fancy+" "+stake+" ("+level+")";
else f.msg.value = "下注"+stake;
}
}
function lets_go(f)
{
if(!running && stopped) init();
if(!running && !stopped)
{
if(stake > parseInt(f.wlt.value)) f.msg.value="你的赌注不够了！";
else
if(fancy == "") f.msg.value="选择一种颜色";
else
if(stake == "") f.msg.value="请下赌注！";
else
{
running = 1;
run_race();
}
}
}
function run_race()
{
var n = Math.floor(Math.random() * 4);
if(document.all)
{
switch(n)
{
case 0 : document.all.redc.style.left = parseInt(document.all.redc.style.left)+step[0];
if(parseInt(document.all.redc.style.left) >= 288)
{
document.all.redc.style.left = 288;
winner = "红色";
running = 0;
stopped = 1;
}
break;
case 1 : document.all.grnc.style.left = parseInt(document.all.grnc.style.left)+step[1];
if(parseInt(document.all.grnc.style.left) >= 288)
{
document.all.grnc.style.left = 288;
winner = "绿色";
running = 0;
stopped = 1;
}
break;
case 2 : document.all.bluc.style.left = parseInt(document.all.bluc.style.left)+step[2];
if(parseInt(document.all.bluc.style.left) >= 288)
{
document.all.bluc.style.left = 288;
winner = "蓝色";
running = 0;
stopped = 1;
}
break;
case 3 : document.all.yelc.style.left = parseInt(document.all.yelc.style.left)+step[3];
if(parseInt(document.all.yelc.style.left) >= 288)
{
document.all.yelc.style.left = 288;
winner = "黄色";
running = 0;
stopped = 1;
}
break;
}
}
if(running) window.setTimeout("run_race()", 100);
else
results();
}
function results()
{
if(document.all)
{
if(winner == fancy)
{
var winnings = parseInt(stake) * parseInt(level.charAt(0));
document.f.msg.value = winner+"胜利：获得"+winnings;
total += winnings;
document.f.wlt.value = total;
}
else
{
document.f.msg.value = winner+" 胜利：失去"+stake;
total -= parseInt(stake);
document.f.wlt.value = total;
}
if(parseInt(document.f.wlt.value) == 0) var refill = confirm("你输了！再来一次吗？");
if(refill)
{
total = 10000;
document.f.wlt.value = total;
init();
}
}
}
browser_check()
</script>