//本来要给火狐提交bug的,发现复现不鸟,我勒个去
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
<style>
html,body{
width:100%;
height:100%;
}
body{
position:relative
}
section{
position:absolute
}
.s1{
left:10px;
}
.s2{
left:40px;
}
.s3{
left:80px
}
input{
display:none;
outline:none
}
</style>
<body>
<section class="s1">
11
</section>
<section class="s2">
11
</section>
<section class="s3">
11
</section>
<input type="text">
<script>
var Drag = function( e ){
this.e = typeof e === "string" ? document.getElementById(e) : e;
this.initDrag();
}
Drag.prototype = {
zIndex : 0,
constructor : Drag,
initDrag : function(){
this.e.addEventListener("mousedown",this.ev.bind(this));
},
ev : function(e){
switch(e.type){
case "mousedown":
this.dx = e.clientX - this.e.offsetLeft;
this.dy = e.clientY - this.e.offsetTop;
this.e.zIndex = this.zIndex++;
this.fn = this.ev.bind(this);
document.addEventListener("mousemove",this.fn);
document.addEventListener("mouseup",this.fn);
break;
case "mousemove":
this.e.style.left = e.clientX - this.dx + "px";
this.e.style.top = e.clientY - this.dy + "px";
break;
case "mouseup":
document.removeEventListener("mouseup",this.fn)
document.removeEventListener("mousemove",this.fn)
break;
};
e.cancelBubble = true;
e.defaultPrevented = true;
e.stopPropagation();
e.preventDefault();
return
}
};
Array.prototype.slice.call(document.querySelectorAll("section"),null).forEach(function(e,i){
new Drag(e);
e.addEventListener("mouseup",function(){
var css = Object.create( window.getComputedStyle(e,null) ),
t = parseInt(css.top) + "px",
l = parseInt(css.left) + "px";
/************************************/
e.style.left = 0;
e.style.top = 0;
/************************************/
console.log( window.getComputedStyle(e,null).left )
console.log( window.getComputedStyle(e,null).top )
e.style.left = l
e.style.top = t
});
});
</script>
</body>
</html>

  

bugzilla_firefox的更多相关文章

随机推荐

  1. Network client/server

    <Beginning Linux Programming_4th>  chapter 15 Sockets 1  A simple local client/server 1)  clie ...

  2. Mango Weekly Training Round #3 解题报告

    A. Codeforces 92A Chips 签到题.. #include <iostream> #include <cstdio> #include <cstring ...

  3. Redis集群环境的部署记录

    Redis Cluster终于出了Stable,这让人很是激动,等Stable很久了,所以还是先玩玩. 一. 集群简单概念. Redis 集群是一个可以在多个 Redis 节点之间进行数据共享的设施( ...

  4. Pureftp-安全的ftp服务器部署

    一.简介: Pure-FTPd 是一款免费(BSD)的,安全的,高质量和符合标准的FTP服务器. 侧重于运行效率和易用性. 它提供了简单的答案,他满足了大众化的需求,包括普通用户以及主机供应商们 Pu ...

  5. 应用python编写简单新浪微博应用(一)

    转载至:http://blog.sina.com.cn/s/blog_6c39196501016o7n.html 首先,你要有一个新浪微博账号. 申请页面:http://weibo.com 其次,你要 ...

  6. RDLC系列之二 子报表

    本文实现简单的子报表 一.效果图

  7. 未能加载文件或程序集“XXXXX”或它的某一个依赖项。试图加载格式不正确的程序。

    未能加载文件或程序集“FastColoredTextBox, Version=2.10.5.0, Culture=neutral, PublicKeyToken=null”或它的某一个依赖项.试图加载 ...

  8. php基础32:正则匹配-修饰符

    <?php //正则表达式--修饰符一般放在//的外面 //1. i 表示不区分大小写 $model = "/php/"; $string = "php" ...

  9. js实现倒计时 类似团购网站

    一.demo与效果展示 为节约时间,我就直接套用了企鹅团的界面作为demo的背景.因为是倒计时,所以需要一个固定的时间,为了n年后,某位仁兄打开demo页面依然在倒计时,所以我把倒计时时间设成了205 ...

  10. pandas 练习

    from pandas import Series, DataFrame # Series接收list或dict作为一维数据 #两个属性:values, index #① s1 = Series([4 ...