推荐:怎么用javascript进行拖拽
作者：雪山老人 来源：sohotx.com 发布时间：2007-09-21 20:14:00
怎么用javascript进行拖拽
本文译自：http://www.webreference.com/programming/javascript/mk/column2/index.html
所有版权归原文所有
Javascript的特点是dom的处理与网页效果，大多数情况我们只用到了这个语言的最简单的功能，比如制作图片轮播/网页的tab等等，这篇文章将向你展示如何在自己的网页上制作拖拽．
有很多理由让你的网站加入拖拽功能，最简单的一个是数据重组．例如：你有一个序列的内容让用户排序，用户需要给每个条目进行输入或者用select选择，替代前面这个方法的就是拖拽．或许你的网站也需要一个用户可以拖动的导航窗口！那么这些效果都是很简单：因为你可以很容易的实现！
网页上实现拖拽其实也不是很复杂．第一你需要知道鼠标坐标，第二你需要知道用户鼠标点击一个网页元素并实现拖拽，最后我们要实现移动这个元素．
运行代码框
获取鼠标移动信息
第一我们需要获取鼠标的坐标．我们加一个用户函数到document.onmousemove就可以了:
document.onmousemove = mouseMove;
function mouseMove(ev){
ev = ev || window.event;
var mousePos = mouseCoords(ev);
}
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
};
}
运行代码框
0
投稿猜你喜欢
- 本文实例为大家分享了js简单计算器的实现代码，供大家参考，具体内容如下1.html代码 <input type="text&
试了谷歌到的几种方法，都没有解决，然后突然想起在启动apache的时候，iis的端口占用情况（因为我的apache也使用了80端口），所以&- 介绍：UUID是128位的全局唯一标识符，通常由32字节的字符串表示。使用：import uuid print uuid.uuid1()14
- 同步的方法基本与多线程相同。1) Lock当多个进程需要访问共享资源的时候，Lock可以用来避免访问的冲突。import multiproc
- Protocol 和服务器一样，也是通过该类来实现。先看一个简短的例程：from twisted.internet.protoc
- 在 Python 中，一般情况下我们可能直接用自带的 logging 模块来记录日志，包括我之前的时候也是一样。在使用时我们需要配置一些 H
- Oracle数据库查看一个进程是如何执行相关的实际SQL语句SELECT b.sql_text, sid, serial#, osuser,
- 引言pymysqlpool （本地下载）是数据库工具包中新成员，目的是能提供一个实用的数据库连接池中间件，从而避免在应用中频繁地创建和释放数
- 装tensorflow-gpu的时候经常遇到问题，自己装过几次，经常遇到相同或者类似的问题，所以打算记录一下，也希望对其他人有所帮助基本信息
- 读取问题如下所示，我们在文本中写了一个问题，然后将其读取出来。“黄河远上白云间，一片孤城万仞山。”的作者是谁？王之涣李白白居易杜甫file
- 本文介绍了Python日期的加减等操作的示例，分享给大家，也给自己留个笔记1. 日期输出格式化所有日期、时间的api都在datetime模块
- 模块导入方式： import osos模块是Python标准库中的一个用于访问操作系统相关功能的模块，os模块提供了一种可移植的使
- 前言本文主要分享一个python代码，可以将多个视频中的音频转化为相同采样率的视频。对视频格式的校验没有做，也不是很关键。环境依赖ffmpe
- 前段时间公司数据库服务器崩溃启动不起来，经过我初步排查是/home目录挂载不上导致启动不起来，虽然通过注释/etc/fstab中的挂载信息，
- 一、概述及完整代码对MNIST(MixedNational Institute of Standard and Technology dat
- 在Python中要连接数据库，首先我们得先安装几个重要的东西，主要有： （1）Python-dev包 （2）setupt
- 本文实例讲述了Python简单实现网页内容抓取功能。分享给大家供大家参考，具体如下：使用模块：import urllib2 import u
- 顾名思义，本期内容肯定是涉及编程时间，那在操作python要怎么用time这个方法呢？一起来看下吧~时间模块的定义与使用：时间模块time是
- 最近在做人脸识别清洗样本的工作，发现经过人脸对齐后存在部分图片十分模糊，所以用opencv滤了一下。原理就是使用了cv2.Laplacian
- VS Code 装好ESLint 插件报黄线的问题，具体解决方法如下所示：ESLint is disabled since its exec
