js定位div坐标存入mysql_JavaScript与Div 对层定位和移动获得坐标

1:移动图层 获得点的x轴y轴坐标,从而进行绝对定位(注意:竖拉框会影响 x 轴 y 轴坐标值)

var x,y,z,down=false,obj

function init(){

obj=event.srcElement     //事件触发对象

obj.setCapture()            //设置属于当前对象的鼠标捕捉

z=obj.style.zIndex          //获取对象的z轴坐标值

//设置对象的z轴坐标值为100,确保当前层显示在最前面

obj.style.zIndex=100

x=event.offsetX   //获取鼠标指针位置相对于触发事件的对象的X坐标

y=event.offsetY   //获取鼠标指针位置相对于触发事件的对象的Y坐标

down=true         //布尔值,判断鼠标是否已按下,true为按下,false为未按下

}

function moveit(){

//判断鼠标已被按下且onmouseover和onmousedown事件发生在同一对象上

if(down&&event.srcElement==obj){

with(obj.style){

/*设置对象的X坐标值为文档在X轴方向上的滚动距离加上当前鼠标指针相当于文档对象的X坐标值减鼠标按下时指针位置相对于触发事件的对象的X坐标*/

// posLeft=event.x-x;

posLeft=document.body.scrollLeft+event.x-x;

/*设置对象的Y坐标值为文档在Y轴方向上的滚动距离加上当前鼠标指针相当于文档对象的Y坐标值减鼠标按下时指针位置相对于触发事件的对象的Y坐标*/

// posTop=event.y-y;

posTop=document.body.scrollTop+event.y-y;

window.status="posLeft="+posLeft+",posTop="+posTop;

window.status=window.status+"clientX="+event.clientX+"clientY="+event.clientY+"scrollLeft="+document.body.scrollLeft+"scrollTop="+document.body.scrollTop+",event.y="+event.y+",event.x"+event.x;

}

}

}

function stopdrag(){

//onmouseup事件触发时说明鼠标已经松开,所以设置down变量值为false

down=false

obj.style.zIndex=z       //还原对象的Z轴坐标值

obj.releaseCapture() //释放当前对象的鼠标捕捉

//alert("X:"+obj.style.left+";Y:"+obj.style.top);

}

2:为了使图层在不同分辨率浏览器上显示同样的效果,我们需要对图层定位设置

第一步:对最外层 进行相对定位

第二步:在相对里面进行决对定位(这样图层就不会随着分辨率的改变而变形)

1.jpg

ALT="" />

省略
省略
省略
省略
省略
省略
省略
省略
省略

//===================(层移动方法调用)=============================

οnmοuseup=stopdrag()

style="position:absolute;left:60;top:190;width:5;height:5;z-index:99;;border:1px solid #000000;">

D

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/528413.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

mysql 不指定 长度吗_mysql中整数类型后面的数字,是不是指定这个字段的长度?比如int(11),11代表11个字节吗?...

原先对mysql不太理解,但也没有报错。但理解的不够深入。这次补上。原来以为int(11)是指11个字节,int(10)就是10个字节。我错了。http://zhidao.baidu.com/link?urlpuYWaGBQNKNHgffO5kdvXshF3KmX8OuB4Mor3HXapbNHa8m1CdlF8PJTqVuKa1eKcEd6Bv2NKUr3I-KJr5…

python绘制折线图显示数据_漂亮图表也可用python信手拈来!一文教你学会用Python绘制堆积折线图...

今天,和大家聊聊关于Python绘图相关的东东哦,还是和大家继续深耕Python经典的matplotlib库哦!好啦,咱们就开始吧!首先,咱们聊聊如何在Python中去绘制经典的堆积折线图到这可能有些朋友可能会问了&#xff1…

python画图代码对比_Python实现代码差异对比分析

在写代码过程,有时需要对比查看两个代码文件的不同,肉眼查看费事费力,很难进行对比找出不同。例如,程序运行报错时,会对比自己先前写的代码或者参考别人代码,有哪些地方不对,此时便可以通过该程…

flyway配置mysql_Flyway快速上手教程

一、Flyway是什么官网解释地非常全面,可先大致阅读一下。简单地说,flyway是一个能对数据库变更做版本控制的工具。二、为什么要用Flyway在多人开发的项目中,我们都习惯了使用SVN或者Git来对代码做版本控制,主要的目的就是为了解决…

mysql主从 单点_MySQL主从复制虽好,能完美解决数据库单点问题吗?

一、单个数据库 服务器 的缺点数据库服务器存在单点问题;数据库服务器资源无法满足增长的读写请求;高峰时数据库连接数经常超过上限。二、如何解决单点问题增加额外的数据库服务器,组建数据库集群;同一集群中的数据库服务器需要具…

java ora 28040_Oracle 11g与112c中ORA-28040 错误解决

今天遇到一个连接192.168.56.102这个库报错Java.sql.SQLException: ORA-28040: No matching authentication protocolOracle 12C下查询此报错oralce:/oracle/db/app/12.1.0/db/network/admin> oerr ora 2804028040, 0000, "No matching authentication protocol"/…

java实验_Java实验报告(实验一)

课程:Java程序设计 班级: 1351姓名:王玮怡 学号:20135116成绩: 指导教师:娄嘉鹏 实验日期:2015.04.15实验密级: 预习程度&#…

java web 文件上传工具类_JavaWeb中实现文件上传的方式有哪些?

上回我们说了下文件下载的方式有哪些,这次我们从不同的环境下简单来说说文件上传的方式有哪些。文件上传的方式Servlet2.5 方式Servlet3.0 方式SpringMVC 方式案例实操Servlet2.5 方式文件上传涉及到前台页面的编写和后台服务器端代码的编写,前台发送文件…

centos上如何装python_centos如何安装Python3

摘自:https://www.cnblogs.com/Mr-wangxd/p/7028285.htmlLinux下默认系统自带python2.6的版本,这个版本被系统很多程序所依赖,所以不建议删除,如果使用最新的Python3那么我们知道编译安装源码包和系统默认包之间是没有任何影响的&…

java 字节输出流_Java IO详解(三)------字节输入输出流

那么这篇博客我们讲的是字节输入输出流:InputStream、OutputSteam(下图红色长方形框内),红色椭圆框内是其典型实现(FileInputSteam、FileOutStream)1、字节输出流:OutputStreampublic abstract class OutputStreamextends Objectimplements C…

java 缩略图 库_Thumbnailator:一个高质量Java缩略图开发库

February 24, 2020: Thumbnailator 0.4.11 has been released! See Changes for details.Thumbnailator is now available through Maven!What is Thumbnailator?Thumbnailator is a thumbnail generation library for Java.Why Thumbnailator?Making high-quality thumbnail…

java数据段 静态区_回顾一下基础,关于栈与堆,常量池,静态区

先来张简单的图:1.jpg------------------分割------------------------栈内存:1.操作比较快速.但是为私有.2.线程之间不共享.所以存放一些基本数据类型,局部变量(方法走完就回收了),3.对于引用数据类型的地址引用.堆内存:1.new出来的实例2.成员变量的值(如果是基本数据类型,比如…

java项目如何更改路径_Java修改eclipse中web项目的server部署路径问题

和MyEclipse不一样,在Eclipse中做的Web项目默认是不支持将项目发布到Web服务器上的,会发布到工作空间的某个目录,因此无法在外部启动Tomcat来运行Web项目,只有打开Eclipse中的服务器,才能运行Web项目。所以要对Eclipse…

java xpdf 转换成html_java将Word/Excel/PDF文件转换成HTML整理

项目开发过程中,需求涉及到了各种文档转换为HTML或者网页易显示格式,现在将实现方式整理如下:一、使用Jacob转换Word,Excel为HTML“JACOB一个Java-COM中间件.通过这个组件你可以在Java应用程序中调用COM组件和Win32 libraries。”首先下载Jac…

mysql 出现 quot_MYSQL 新版出现 Client does_mysql _ 搞代码

mysql 帮助:A.2.3 Client does not support authentication protocolMySQL 4.1 and up uses an authentication protocol based on a password hashing algorithm that is incompatible with that used by older clients. If you upgrade the server to 4.1, attemp…

Java可移动性不强_java地位无可撼动的原因

如今,面对曾经在程序员中被各种新技术掩盖直至堙灭的技术值得怀念。犹如COBOL这当年被老程序员们尊为神器的语言如今也基本没有价值。而Java作为现代程序员的中坚力量在这点上会不会成为下一个COBOL?有关JAVA的技术卖出多少本书已经是一个很久远的记忆了…

php数据回显是什么意思,jquery回显是什么意思

首先来看一下回显是什么意思?在数据提交出现错误的时候, 已填写的信息仍在文本框中, 比如用户登录, 当用户输入错误的密码之后, 用户名仍在文本框, 只是密码框清空。对于一些要填写很多信息的表单, 如果因为一些错误导致已经填写的整个表单信息重新填写, 对于用户非…

Java摩托车汽车轮胎数量,摩托车轮子上的知识,你知道多少?

原标题:摩托车轮子上的知识,你知道多少?摩托车轮子好比人的两条腿,决定了车子跑得远,跑得快和跑得是否安稳。摩友们似乎对轮子的关心不多,因为它是易损件,概念中轮子轮胎出了问题,随便找路边的“风火补胎”…

php配置文件加盐解密,PHP实现支持加盐的图片加密解密

一个简单的图片加解密函数&#xff0c;使用client跑&#xff0c;不要使用浏览器跑话不多说&#xff0c;直接上代码/*** Created by hello.* User: qq 845875470* Date: 2016/4/2* Time: 11:21*/$notice <<为了稳定性&#xff0c;必须在客户端跑格式 &#xff1a;php pat…

Oracle导入dmp文件报12504,ORA-12504:TNS :监听程序在 CONNECT_DATA 中未获得SERVICE_NAME...

使用本地的SQLPlus连接服务器上的Oracle数据库&#xff0c;这是由于本地有安装了Oracle数据库服务&#xff0c;所以才会系统先提示&#xff1a;ORA-12504:TNS: 监听程序在 CONNECT_DATA 中未获得 SERVICE_NAME再次输入用户名密码系统又提示&#xff1a;ORA-12560: TNS: 协议适配…