发现一个有趣的东西js做的
类似QQ窗口的抖动效果,只是觉得好玩 没什么技术含量。
1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">2
<html xmlns="http://www.w3.org/1999/xhtml">3
<head>4
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />5

<style type="text/css">
6

#body{
}{text-align:center;}7

#test{
}{width:119px;position:absolute;margin:10px auto;height:114px;background:url(http://www.blueidea.com/articleimg/2008/05/5766/01.jpg) ;border:2px dotted red;}8
</style>9
<script type="text/javascript"></script>10
</head>11
<body>12
<div style='margin:10px 200px'>13
<div><input type="button" value="~~~让我抖抖吧~~" onclick="nn.start()" /></div>14
<div><input type="button" value="别抖了眼睛晕的很" onclick="nn.stop()" /></div>15
<div id="test"></div>16
</div>17
</body>18
</html>19

<script type="text/javascript">
20
var m=document.getElementById("test");21

function SKclass (obj,Rate,speed)
{22
var oL=obj.offsetLeft;23
var oT=obj.offsetTop;24
this.stop=null;25
this.oTime=null;26
this.state=0;27
var om=this;28

this.start=function()
{29

if(this.state==0)
{30
ostart();31
this.state=1;32
}33

else
{alert("这样你受得了吗?")} 34
}35

var ostart=function()
{36

if(parseInt(obj.style.left)==oL-2)
{37
obj.style.top=oT+2+"px";38

setTimeout(function()
{obj.style.left=oL+2+"px"},Rate)39
}40

else
{41
obj.style.top=oT-2+"px";42

setTimeout(function()
{obj.style.left=oL-2+"px"},Rate)43
}44

om.oTime=setTimeout(function()
{ostart()},speed);45
}46

this.stop=function()
{47
clearTimeout(om.oTime);48
this.state=0;49
50
}51
}52
var nn=new SKclass(m,20,50);53
</script>


浙公网安备 33010602011771号