[JavaScript]飘浮文字
Code<html>
<head>
<title>hello</title>
</head>
<body>
<div style="font-size:12px">hello world!</div>
</body>
</html>
<script type="text/javascript">
function New(aClass,aParams)
{
function new_()
{
aClass.Create.apply(this,aParams);
}
new_.prototype=aClass;
return new_();
}
function Bind(obj,fun)
{
return function()
{
return fun.call(obj);
}
}
var MoveObj=
{
Create:function(sid)
{
this.obj=document.createElement("div");
this.obj.id=sid;
this._x=1;
this._y=1;
this._xPos=10;
this._yPos=20;
this._step=1;
this._delay=30;
this._timer=null;
Bind(this,MoveObj.SetUp)();
this._timer=setInterval(Bind(this,MoveObj.Start),this._delay);
},
SetUp:function()
{
this.obj.innerHTML="我是浮动文字!<br/>我是浮动文字";
this.obj.style.cssText="position:absolute;font-size:12px;padding:10px;"
this.obj.style.border="1px solid #ccc";
this.obj.style.width="200px";
this.obj.style.height="80px";
document.body.appendChild(this.obj);
},
Start:function()
{
var width=document.body.clientWidth;
var height=height = document.body.clientHeight;
if(this._x==1)
{
this._xPos=this._xPos+this._step;
}
else
{
this._xPos=this._xPos-this._step;
}
if(this._xPos<0)
{
//移动到最左边 重置
this._x=1;
this._xPos=0;
}
if(this._xPos>width-this.obj.offsetWidth)
{
//移动到最右边
this._x=0;
this._xPos=width-this.obj.offsetWidth;
}
if(this._y==1)
{
this._yPos=this._yPos+this._step;
}
else
{
this._yPos=this._yPos-this._step;
}
if(this._yPos<0)
{
//移动到最顶部 重置
this._y=1;
this._yPos=0;
}
if(this._yPos>height-this.obj.offsetHeight)
{
//移动到最底部
this._y=0;
this._yPos=height-this.obj.offsetHeight;
}
this.obj.style.left = this._xPos + document.body.scrollLeft;
this.obj.style.top = this._yPos + document.body.scrollTop;
}
};
var s=New(MoveObj,["mask"]);
</script>
