网(LieHuo.Net)教程 前天老师布置了一道思考题,用Javascript编写可以缓慢弹出收缩的层,折腾了好几个小时,总算写出效果,代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>层的扩展与收缩 - liehuo.net</title></head><body><div style="color:#fff;" id="div1">网提示:点击我试试!</div><script type="text/javascript"> function StretchDiv(divid,color){ var target; var flag=false; var onMouseDown=function(){ if(flag){ var h=parseInt(target.style.height); onMouseDown.shortDiv=function(){ h=h-1; if(h<20){ return; } target.style.height=h+"px"; setTimeout(onMouseDown.shortDiv,30); } onMouseDown.shortDiv(); } else { //target.style.height=parseInt(target.style.height)+180+"px"; var h=parseInt(target.style.height); onMouseDown.longDiv=function(){ h=h+1; if(h>200){ return; } target.style.height=h+"px"; setTimeout(onMouseDown.longDiv,30); } onMouseDown.longDiv(); } flag=!flag; } function init(){ target=document.getElementById(divid); target.style.position = "absolute"; target.style.width = "200px"; target.style.height = "20px"; target.style.left = "100px"; target.style.top = "100px"; target.style.backgroundColor = color; target.onmousedown = onMouseDown; } init(); } new StretchDiv("div1","blue"); </script></body></html><br /><center>如不能显示效果,请按Ctrl+F5刷新本页,更多网页代码:<a href='http://www.wfuyu.com/' _fcksavedurl='http://www.wfuyu.com/' target='_blank'>http://www.wfuyu.com/</a></center>提示:可修改后代码再运行!
上一篇 目前工作中几个常用的SQL存储过程
下一篇 Sql Server 2008用ODBC连接到SYBASE ASE