<html>
<head>
<title>用javascript拖动DIV层</title>
<style>
body{font-family:Verdana;font-size:11px;color:#333;}
#win1{[position:absolute;left:100;top:100;width:200px;height:150px;border:1px solid #000;}
.title{width:100%;background:#000;height:18px;color:#fff;cursor: move;}
</style>
</head>
<body>
<script>
var move=false;
function StartDrag(obj)
{
if(event.button==1&&event.srcElement.tagName.toUpperCase()=="DIV")
{
obj.setCapture();
obj.style.background="#999";
move=true;
}
}function Drag(obj)
{
if(move)
{
var oldwin=obj.parentNode;
oldwin.style.left=event.clientX-100;
oldwin.style.top=event.clientY-10;
}
}function StopDrag(obj)
{
obj.style.background="#000";
obj.releaseCapture();
move=false;
}
</script>
<div id="win1">
<div class="title" onMousedown="StartDrag(this)" onMouseup="StopDrag(this)" onMousemove="Drag(this)" >窗口1</div>
This is a moveable window.<br>
Moreinfo in
</div>
</body>
</html>
分享到:
相关推荐
javascript浮动div,可拖拽div,遮罩层(div和iframe实现)
javascript div拖动层 ,代码简单。
javascript 拖拽 div 源代码,超简单
用javascript拖动div或table等对象。 代码兼容各种浏览器,IE,Firefox,Opera,Safari等。 这里有三种拖动效果。
附件中有5个不同的网页,使用JavaScript实现div窗口拖动
Js无刷新添加新层,拖动DIV层可互换位置的JavaScript实现 Js无刷新添加新层,拖动DIV层可互换位置的JavaScript实现
纯Javascript编写的div拖拽以及用鼠标绘制div之间连接线,外部资源仅需要jquery。有以下功能: 1、创建节点 2、节点随鼠标任意拖动 3、切换拖动和画线模式 4、用鼠标绘制两个节点之间带有箭头的连线 5、连接线随节点...
主要介绍了JavaScript实现DIV层拖动及动态增加新层的方法,设计javascript操作div层的拖动与增加的相关技巧,需要的朋友可以参考下
javaScript实现DIV简单拖拽
很棒的用Javascript实现DIV的拖拽和添加
Asp.net+JavaScript 实现的可拖动、可调节大小的 div层,div层中添加 sql2000 数据 开发工具:Visual2005,兼容Visual2008 数据库名:2010Expo 数据库附加失败可以直接建表manage 表属性manageid,managename,phone,...
Javascript的特点是dom的处理与网页效果,大多数情况我们只用到了这个语言的最简单的功能,比如制作图片轮播/网页的tab等等,这篇文章将向你展示如何在自己的网页上制作拖拽
JQ JS javascript layui UI组件 元素 div 拖动插件JQ JS javascript layui UI组件 元素 div 拖动插件
javascript实现div的拖拽 html 文件,兼容火狐 IE
利用javascript移动div层-javascript 拖动层: 程序功能:利用javascript开发在界面上随意拖动以下html code中的div层. javascript移动div层-javascript 拖动层代码-html code: 代码如下:<div id=”div_Info” xss=...
DIV 拖动的实际例子,因为分数不多了,所以才增加资源分的,如果您分数也不够的话,可以直接跟我联系, 我通过EMAIL发给你.
此文档书写规范。主要是利用javaScript在页面控制弹出一个可以任意拖动的DIV层。
主要介绍了JavaScript实现可拖拽的拖动层Div的方法,拖拽页面中的div块可实现div块按照拖动轨迹移动的效果,涉及javascript鼠标事件、页面元素样式结合事件函数动态操作的相关技巧,需要的朋友可以参考下
javascript实现鼠标拖动div的效果。。。
js模拟浏览器 Ctrl+F 查找 + div层鼠标拖动 改变位置 两个功能demo js模拟浏览器 Ctrl+F 查找 + div层鼠标拖动 改变位置 两个功能demo js模拟浏览器 Ctrl+F 查找 + div层鼠标拖动 改变位置 两个功能demo js模拟...