| 标题 | js使用settimeout实现定时炸弹的方法 |
| 范文 | 今天看 css探索之旅 的博客文章，有个用settimeout写定时炸弹的效果，自己也就照猫画猫来写一个。 <!doctype html public -//w3c//dtd xhtml 1.0 transitional//en > <html xmlns=> <head> <meta http-equiv=content-type content=text/html; charset=gb2312/> <title>无标题文档</title> <style> div{ width:200px; height:50px; margin:30px auto 0; background:#ccc; text-align:center; font:14px/50px arial; cursor:pointer } </style> <script type=text/javascript src=js/jquery_1.4.2.js></script> </head> <body> <div id=zha>开始定时</div> <div id=chai style=display:none>拆除炸弹</div> <script> $(#zha).bind(click,function(){ zha(); }) $(#chai).bind(click,function(){ chai(); }) var time = 5; var timer = 0; function zha(){ var text = 倒计时; text += time--; $(#zha).text(text); if(time >=0){ timer = settimeout(zha,1000); $(#zha).css(color,black); $(#chai).show(); }else{ $(#zha).text(爆炸); $(#zha).css(color,red); time = 5; $(#chai).fadeout(); } } function chai(){ cleartimeout(timer); $(#zha).text(炸弹拆除成功,点击继续); } </script> </body> </html> |
| 随便看 |
|
在线学习网范文大全提供好词好句、学习总结、工作总结、演讲稿等写作素材及范文模板，是学习及工作的有利工具。