jquery 实现鼠标点击div盒子移动功能
// Start 窗口的拖动
var _move=false; //移动标记
var _x,_y; //鼠标离控件左上角的相对位置
$(document).ready(function(){
$(".box h4").click(function(){
// alert("click");//点击(松开后触发)
}).mousedown(function(e){
var _this = $(".box");
if(!_move){
_move=true;
_x=e.pageX-parseInt(_this.css("left"));
_y=e.pageY-parseInt(_this.css("top"));
}else{
_move=false;
}
});
$(document).mousemove(function(e){
var _this = $(".box");
if(_move){
var x=e.pageX-_x;
var y=e.pageY-_y;
_this.css({top:y,left:x});
}
}).mouseup(function(){
var _this = $(".box");
_move=false;
});
});
jquery 实现鼠标点击div盒子移动功能的更多相关文章
- jQuery实现鼠标点击div外的地方div隐藏消失的效果(转)
转:https://www.cnblogs.com/jsingleegg/p/3456152.html css部分: <style type="text/css">.p ...
- jQuery实现鼠标点击div外的地方div隐藏消失的效果
css部分: <style type="text/css"> .pop { width:200px; height:130px; background:#080;} & ...
- jQuery实现鼠标点击Div区域外隐藏Div
冒泡定义:当一个元素上的事件被触发的时候,比如说鼠标点击了一个按钮,同样的事件将会在那个元素的所有祖先元素中被触发.这一过程被称为事件冒泡:这个事件从原始元素开始一直冒泡到DOM树的最上层.(摘自网络 ...
- 使用JS或jQuery模拟鼠标点击a标签事件代码
原文 使用JS或jQuery模拟鼠标点击a标签事件代码 这篇文章主要介绍了使用JS或jQuery模拟鼠标点击a标签事件代码,需要的朋友可以参考下 <a id="alink" ...
- 使用jQuery模拟鼠标点击a标签事件
来源于:https://mo2g.com/view/42/ <html> <head> <meta charset="UTF-8"> <t ...
- 使用JS或jQuery模拟鼠标点击a标签事件
<a id="alink" href="abc.aspx" style="visibility: hidden;">下一步&l ...
- 鼠标移动或者鼠标点击div消失不见排查
点击事件,导致某div或者容器样式隐藏,如果不能直接发现click事件绑定,那么首先排查哪些方法在控制div的样式, 然后看一看哪些方法在调用修改样式的方法. 然后再排查什么在调用修改样式的方法的方法 ...
- 鼠标点击DIV后,DIV的背景变色(js)
<!DOCTYPE html> <html> <head> <script> window.onload = function(){ var divs ...
- 鼠标点击input时,placeholder中的提示信息消失
html代码: <input type="text" placeholder="多个关键词空格隔开"> 鼠标点击input时,placeholder ...
随机推荐
- [LUOGU] 2820 局域网
题目背景 某个局域网内有n(n<=100)台计算机,由于搭建局域网时工作人员的疏忽,现在局域网内的连接形成了回路,我们知道如果局域网形成回路那么数据将不停的在回路内传输,造成网络卡的现象.因为连 ...
- 5.电影搜索之 自动填充,也叫autocomplete、搜索建议!
什么叫自动填充,用过百度的应该都知道!当你输入关键词之后,会有一个下拉的候选列表,都是与你输入的内容相关的,这个就是自动填充的搜索建议.一般的搜索引擎或者站内搜索都会有这个功能. 今天分享下这个功能的 ...
- pandas模块(很详细归类),pd.concat(后续补充)
6.12自我总结 一.pandas模块 import pandas as pd约定俗称为pd 1.模块官方文档地址 https://pandas.pydata.org/pandas-docs/stab ...
- python爬虫基础02-urllib库
Python网络请求urllib和urllib3详解 urllib是Python中请求url连接的官方标准库,在Python2中主要为urllib和urllib2,在Python3中整合成了urlli ...
- Shell:命令用户、用户组管理useradd、usermod
文件及内容处理 - useradd.usermod 1. useradd:添加用户 useradd命令的功能说明 useradd 命令用于建立用户帐号.useradd 可用来建立用户帐号.帐号建好之后 ...
- LeetCode(121) Best Time to Buy and Sell Stock
题目 Say you have an array for which the ith element is the price of a given stock on day i. If you we ...
- PAT Basic 1049
1049 数列的片段和 给定一个正数数列,我们可以从中截取任意的连续的几个数,称为片段.例如,给定数列 { 0.1, 0.2, 0.3, 0.4 },我们有 (0.1) (0.1, 0.2) (0.1 ...
- Knockout v3.4.0 中文版教程-12-控制文本内容和外观-html绑定
3. html绑定 目的 html绑定会使关联的DOM元素显示你参数指定的html内容. 当你的视图模型里面的值是HTML标记字符串,而你想要呈现它,这时候用html绑定特别合适. 例子 <di ...
- python知识点拾遗
内容概要 1.__str__ 2.os.path相关方法 1.__str__ 我们先定义一个Student类,打印一个实例: class Student(object): def __init__(s ...
- matlab中函数学习——11月14日
1.记录数组元素个数函数:numel() 解释:number of array 相当于 prod(size(A)) 2.添加路径: addpath('.\3rdparty\ksvd'); 3.pada ...