JS超简单代码实现鼠标拖动效果

鼠标拖曳是比较常用的一种网页效果，为了实现这种效果，一般会考虑采用相关插件，插件往往包括多个文件，代码量就显示比较多。今天我们要分享的则是一段超极简短的JavaScript代码实现的鼠标拖动效果，函数本身仅287个字符。如果不用考虑兼容性和变量封装，函数代码字符数还可以更少。JS超简单代码实现鼠标拖动效果全部代码如下：

<div id="demo" style="width:100px; height:100px; position:absolute; background-color:silver;"></div>
<script>
function dragable(id){var d=document,o=d.getElementById(id),s=o.style,x,y,p='onmousemove';o.onmousedown=function(e){e=e||event;x=e.clientX-o.offsetLeft;y=e.clientY-o.offsetTop;d[p]=function(e){e=e||event;s.left=e.clientX-x+'px';s.top=e.clientY-y+'px'};d.onmouseup=function(){d[p]=null}}}
dragable("demo");
</script>