一直用到div的拖拽,从未自己实现过,今天看了一下,简单写一下,还是可以用的,主要分享给那些和我一样js薄弱的哥们,希望可以帮到你们!!!
<div id="sara_org" style="width:100px;height:100px;background:#058ccc;position:absolute"></div>
<script type="text/javascript">
function sDrag(id) {
var id = id || 'sara';
var m = document.getElementById(id);
var flag = false;
var sX = sY = 0;
m.onmousedown = function(e) {
if (e.button == 0) {
flag = true;
}
sX = e.clientX - m.offsetLeft;
sY = e.clientY - m.offsetTop;
return false
};
document.onmousemove = function(e) {
if (flag == true) {
var x = e.clientX - sX;
var y = e.clientY - sY;
m.style.marginLeft = m.style.marginTop = 0;
m.style.left = x + 'px';
m.style.top = y + 'px';
}
return false;
};
document.onmouseup = function() {
flag = false;
return false;
};
}
$(function() {
sDrag('sara_org');
})
</script>

评论() 相关

收藏

赞

sara_org

ThinkPHP 是一个免费开源的,快速、简单的面向对象的 轻量级PHP开发框架 ,创立于2006年初,遵循Apache2开源协议发布,是为了敏捷WEB应用开发和简化企业应用开发而诞生的。ThinkPHP从诞生以来一直秉承简洁实用的设计原则,在保持出色的性能和至简的代码的同时,也注重易用性。并且拥有众多的原创功能和特性,在社区团队的积极参与下,在易用性、扩展性和性能方面不断优化和改进,已经成长为国内最领先和最具影响力的WEB应用开发框架,众多的典型案例确保可以稳定用于商业以及门户级的开发。