手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >Javascript简单实现可拖动的div
Javascript简单实现可拖动的div
摘要:复制代码代码如下:varx;vary;function$(id){returndocument.getElementById(id)}fun...

复制代码 代码如下:

<html>

<head>

<script type="text/javascript">

var x;

var y;

function $(id)

{

return document.getElementById(id)

}

function mousedown()

{

x=event.clientX-$("px").style.pixelLeft;

y=event.clientY-$("px").style.pixelTop;

$("px").style.border="2px solid red";

$("px").onmousemove = mousemove;

}

function mouseup()

{

$("px").onmousemove = "";

$("px").style.border="";

}

function mousemove()

{

$("px").style.pixelLeft=event.clientX-x;

$("px").style.pixelTop=event.clientY-y;

}

</script>

</head>

<body>

<div id="px"

onmousedown="mousedown()" onmouseup="mouseup()" >

</div>

</body>

</html>

【Javascript简单实现可拖动的div】相关文章:

javascript实现查找数组中最大值方法汇总

JavaScript的9种继承实现方式归纳

javascript基于DOM实现省市级联下拉框的方法

Javascript实现每日自动换一张图片的方法

JavaScript实现表格点击排序的方法

基于javascript简单实现对身份证校验

在JavaScript应用中使用RequireJS来实现延迟加载

JavaScript中使用Math.PI圆周率属性的方法

javascript自定义右键弹出菜单实现方法

Javascript节点关系实例分析

精品推荐
分类导航