網(wǎng)頁特效代碼模板無憂>網(wǎng)頁特效>層和布局特效代碼>

學(xué)習(xí)DIV+JS網(wǎng)頁拖動層的好實(shí)例_層和布局特效

學(xué)習(xí)DIV+JS網(wǎng)頁拖動層的好實(shí)例，因?yàn)楸径未a演示了如何編寫一個自動還原與不還原的拖動層，也就是有的拖動層鼠標(biāo)移動后可以回到原始的位置，而有的則是隨著鼠標(biāo)移到哪就是哪兒，這兩種拖動方法本段代碼都向你很好的展示了，因些，對學(xué)習(xí)非常有幫助。

<html>
<head>
<title>學(xué)習(xí)網(wǎng)頁拖動層的好實(shí)例</title>
<meta http-equiv="mrc-Type" mrc="text/html;charset=gb2312">
<style type="text/css">
*{padding:0px auto;margin:0px auto;}
body{font-size:12px;font-family:宋體;}
.a1{width:135px;height:100px;border:1px solid red;float:left;background:lightgreen;margin:5px;padding:5px;}
.a2{width:135px;height:100px;border:1px solid red;float:right;background:lightgreen;margin:5px;padding:5px;}
</style>
<script language="javascript">
function tuo(){
var objthis=this;
this.x=null;
this.y=null;
this.xx=null;
this.yy=null;
this.xxx=null;
this.yyy=null;
this.obja=null;
this.co=null;
this.t=null;
document.onmousemove=function(){
   try{objthis.x=arguments[0].screenX;objthis.y=arguments[0].screenY;}
   catch(err){objthis.x=window.event.x;objthis.y=window.event.y;}
   }
}
tuo.prototype.create=function(a,b){
if(this.obja==null){
this.co=b;
var objthis=this;
this.obja=a;
this.obja.onmouseup=function(){objthis.up()}
this.xx=this.x;
this.yy=this.y;
this.xxx=this.obja.offsetLeft;
this.yyy=this.obja.offsetTop;
this.obja.style.position="absolute";
this.move();
}
}
tuo.prototype.move=function(){
var objthis=this;
var x=this.xxx + this.x - this.xx;
var y=this.yyy + this.y - this.yy;
this.obja.style.left = x + "px";
this.obja.style.top = y + "px";
this.t=setTimeout(function(){objthis.move()},1)
}
tuo.prototype.up=function(){
clearTimeout(this.t)
if(this.co==1){
this.obja.style.left = this.xxx + "px";
this.obja.style.top = this.yyy + "px";
}
this.xxx=null;
this.yyy=null;
this.obja=null;
}
var cc1=new tuo();
</script>
</head>
<body>

<div class="a1" onmousedown="cc1.create(this,1)">自動還原到原處</div>
<div class="a2" onmousedown="cc1.create(this)">不還原，拖到哪是哪</div>
</body>
</html>

所屬頻道：層和布局特效/更新時間：2012-12-03

[收藏][報錯][返回列表]

相關(guān)層和布局特效：

欧美三区四区_av先锋影音资源站_亚洲第一论坛sis_影音先锋2020色资源网_亚洲精品社区_在线免费观看av网站_国产一区二区伦理_亚洲欧美视频一区二区_99视频精品全部免费在线_精精国产xxxx视频在线

學(xué)習(xí)DIV+JS網(wǎng)頁拖動層的好實(shí)例_層和布局特效

層和布局特效Rss訂閱特效代碼搜索

層和布局特效推薦

猜你也喜歡看這些