用javascript做拖动层布局的思路
作者：亮亮 来源：亮亮博客 发布时间：2008-05-30 13:38:00
标签：拖动,布局,javascript
这几天不是很忙，就找了些拖动布局方面的资料看看，也学着写了个拖动布局的效果，没想到花了好多时间，七拼八凑，总算是把这个效果写出来了。哎！还是js的功夫太差。因为是边找资料边写的，很多地方印象不深，时间一长，再重新写估计也难，所以把当时的思路记录一下！也希望大虾指点一下！
好了，转入正文，在开始之前先介绍几个功能函数！
1.格式化事件的函数
function getEvent(){
//同时兼容ie和ff的写法
if(document.all) return window.event;
func=getEvent.caller;
while(func!=null){
var arg0=func.arguments[0];
if(arg0){
if((arg0.constructor==Event || arg0.constructor ==MouseEvent)
|| (typeof(arg0)=="object" && arg0.preventDefault && arg0.stopPropagation)){
return arg0;
}
}
func=func.caller;
}
return null;
}
2.取得鼠标的位置
function mouseCoords(ev){
if(ev.pageX || ev.pageY){
return {x:ev.pageX, y:ev.pageY};
}
return {
x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
y:ev.clientY + document.body.scrollTop - document.body.clientTop
};
}
3.得到元素的位置
function getPosition(ele){
var left = 0;
var top = 0;
while (ele.offsetParent){
left += ele.offsetLeft;
top += ele.offsetTop;
ele = ele.offsetParent;
}
left += ele.offsetLeft;
top += ele.offsetTop;
return {x:left, y:top};
}
首先，当然是写好初始布局的页面
查看演示一：
drag1.html （7.33 KB）
0
投稿猜你喜欢
简易网页搜集器前面我们已经学会了简单爬取浏览器页面的爬虫。但事实上我们的需求当然不是爬取搜狗首页或是B站首页这么简单，再不济，我们都希望可以- ASP中从数据库读取二进制文件数据代码：<％driver_name1="DRIVER={Microsoft&n
- 在建立与服务器的连接时出错。在连接到 SQL Server 2005 时，在默认的设置下 SQL Server 不允许进行远程连接可能会导致
- 今天给大伙说说python发送邮件，官方的多余的话自己去百度好了，还有一大堆文档说实话不到万不得已的时候一般人都不会去看，回归主题：本人是m
- 本文实例讲述了Python单元测试与测试用例。分享给大家供大家参考，具体如下：单元测试与测试用例简介测试用例是一组单元测试，这些单元测试一起
- 前言忘了在哪看到一位编程大牛调侃，他说程序员每天就做两件事，其中之一就是处理字符串。相信不少同学会有同感。在Python中，我们经常会遇到字
- 注意，要看懂这里，必须具备简单的Python数据分析知识，必须知道matplotlib的简单使用！例1：plt.subplot(221) #
- 1、问题现象：有个网站是通过session验证的，前端时间访问正常，但近期后台session老是失效很快，根本没法操作，我设置timeout
- 这个javascript农历日历,万年历代码网上看到的，很不错，功能齐全，值得收藏！功能介绍:动态显示当前世界各国各时区时间，显示当前农历，
- 五、过渡转化的使用在《mind hack》一书中，揭示了人脑鲜为人知的工作原理。其中提到了“突然的移动或闪烁会吸引人的注意力，这正是负责视觉
- 一、前期工作环境：python3.6，1080ti，pytorch1.10（实验室服务器的环境）1.设置GPU或者cpuimport tor
- 我们知道了钢琴键盘的音高是其实是有规律的，如下频率翻倍，高一个八度国际基准音：440Hz，钢琴键盘上对应小字一组的la小字一组的la可以看下
- 前言：什么是cookie?Cookie，指某些网站为了辨别用户身份、进行session跟踪而储存在用户本地终端上的数据（通常经过加密）。比如
- php获取图片的exif信息，php自带一个exif_read_data函数可以用来读取图片的exif信息，代码来自php手册<?ph
- Python使用Pika库（安装：sudo pip install pika）可以操作RabbitMQ消息队列服务器（安装：sudo apt
- 在本篇文章里，我们会使用一个简单的Web表单，它会列出某个目录下的一些XML文件。然后，我们会从这个目录里选择一个文件，将它发送到另一个We
- 函数可以参考：<％ '注册论坛用户,参数说明 'username 用户登录名称
- 一般与页面有关的系统都会有大量的静态文件，包括js、css以及图标图片等，这些文件一般是项目的相对路径，在加载的时候会从本地读取再转发出去。
- 前言Javascript闭包在学习过程中一般较难理解，本文从什么是闭包，常见闭包示例，闭包作用，闭包应用及闭包问题等方面来介绍闭包，希望能给
- php中可以使用 mb_detect_encoding() 函数来判断字符串是什么编码的。当在php中使用mb_detect_encodin
