如何用JS 获取DIV的坐标位置?
发布网友
发布时间：2022-04-29 21:38
我来回答
共3个回答
懂视网
时间：2022-04-22 17:26
本篇文章给大家带来的内容是关于JavaScript如何获取鼠标移入div的方向，有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。
前几天看了百度图片带有的文字标题，它会随着鼠标的移动方向载入，觉得蛮有意思，于是就想实现这么个功能。经过一番搜索和查找，找了两种实现方法。
方法一：用四个div拼成一个区域，从哪个div移入，就是从哪个方向移入。
方法二：获取鼠标移入的那个点，距离div的左右上下哪条边最近，最近的那条边就是鼠标移入的方向。
针对方法二，自己写了个小方法，代码如下，仅供参考：
function getDirection(ev) {
var mx = ev.clientX,
my = ev.clientY;
var el = this.offsetLeft,
et = this.offsetTop,
ew = this.clientWidth,
eh = this.clientHeight;
var left = mx - el,
right = el + ew - mx,
top = my - et,
bottom = et + eh - my;
var min = Math.min.apply(Math, [left, right, top, bottom]);
if (min === left) {
return "left";
} else if (min === right) {
return "right";
} else if (min === top) {
return "top"
} else {
return "bottom";
}
}
热心网友
时间：2022-04-22 14:34
div事先在输入框的下面的而且是隐藏的，当点击表情图标，div通过onclick激活JS某个函数，该函数内必须会有一段使隐藏的div显示出来的方法语句，是通过这样个流程实现的。
怎样去定位这个表情DIV的位置的，这个css里面有一个叫position的方法，利用坐标x,y实现div位置任意改变。
把div设置成相对定位或绝对定位，总之是让其拥有left,top值，当鼠标移进div的时候获取鼠标的坐标，用鼠标的left减去div的left值就是鼠标在div里面的left值，即鼠标在div中的x坐标，
同理，用鼠标的top值减去div的top值就是鼠标在div里面的top值，即鼠标在div中的y坐标。
热心网友
时间：2022-04-22 15:52
如何用JS 获取DIV的坐标位置方法：
第一种
第二种
js实现获取div坐标com.whuang.hsj.divCoordinate()方法介绍：
功能:返回div坐标;
参数:div对象或div的id(字符串);
返回值:对象,有六个属性:
width:div自身的宽度;
height:div自身的高度;
x:div左上角的坐标x;
y:div左上角的坐标y;
scrollLeft:水平滚动条的位置
scrollTop:竖直滚动条的位置
js实现获取div坐标的方法
/*** * 获取div的坐标 * @param divObj * @returns {{width: number, height: number, left: *, top: Window}} */com.whuang.hsj.divCoordinate=function(divObj){ if(typeof divObj == 'string'){ divObj=com.whuang.hsj.$$id('divObj'); } return {'width':divObj.offsetWidth,...
用js 获取一个div坐标的方法是什么?
js获取DIV的位置坐标的方法大概有两种：第一种：编辑代码：var odiv=document.getElementById('divid');alert(odiv.getBoundingClientRect().left);alert(odiv.getBoundingClientRect().top);第二种：编辑代码function CPos(x, y) {this.x = x; this.y = y;} /*** 得到对象的相对浏览器的坐...
原生JS获取页面中DIV绝对位置的方法
在 JS获取div高度的方法 中，整理了几个有关于获取div高度的方法，后来又遇到一个问题，怎么获取DIV在页面中的绝对位置，因此在这篇笔记中记录一下。 页面结构 样式 getBoundingClientRect用于获取某个元素 相对于视窗 的位置集合。集合中有top, right, bottom, left等属性。offsetLeft指的是元素相对...
js改变div的位置?
vartop=obj.offsetTop;//循环获得元素的父级控件，累加左和顶端偏移量；while(obj=obj.offsetParent){ left+=obj.offsetLeft;top+=obj.offsetTop;} //设置层的坐标并显示；document.all.divShow.style.pixelLeft=left;//层的顶端距离为元素的顶端距离加上元素的高；document.all.divShow.style.pixelTo...
js设置光标位置(js获取光标所在元素)
1. js获取光标所在元素把div设置成相对定位或绝对定位,总之是让其拥有left,top值, 当鼠标移进div的时候获取鼠标的坐标, 用鼠标的left减去div的left值就是鼠标在div里面的left值,即鼠标在div中的x坐标, 同理, 用鼠标的top值减去div的top值就是鼠标在div里面的top值,即鼠标在div中的y坐标 这样我们就获取了鼠标...
怎么在js里取得div的top值和left值
首先要取得top值和left值，先要把这个div的定位设为 relative 或者 absolute 比如：<div id="tiao" style="margin-top: 3;margin-left: -5;width: 470;height: 25;position:relative" ></div> top值： document.getElementById('tiao').offsetTop+document.body.scrollTop left值：document.get...
JS如何获取某个DIV下的元素
1、创建一个test.html文件。2、在文件内，在div标签内，使用p标签创建一行文字，同时创建一个button按钮，用于触发执行js函数。3、在js标签内，创建函数，在函数内，使用getElementById()方法通过id（mydiv）获是div对象，再使用getElementsByTagName()方法获得div下面的p元素对象，最后，使用alert()方法...
如何利用js向指定位置添加一个div层
1、利用js代码首先创建一个div，document.createElement('div');2、确认div添加位置，可以在某个dom元素后面，或者通过css属性控制具体位置，主要通过left/top等属性控制。3、确定位置之后，显示div即可。示例：比如html中有一个文本输入框，我们现在需要在挨着输入框右下角位置显示一个div。<input type="...
js或jquery怎样获取htm中div控件相对于页面的left和top值解决方_百度...
("选择器").offset() //该方法返回当前选择元素的第一个元素左上角(包括边框)距离整个页面顶部和左边的距离,返回值为{left:x, top:y} 例:$("div").offset().top;得到该元素在距离页面顶部的距离 ("选择器").offsetParent() //该方法与offset返回值类型相同,只不过此方法返回的是该元素距离...
JS移动端获取触控位置
1、如图位置是一个html中的可编辑内容的div标签，在里边输入文字，会有一个光标。2、通过getSelection可以获得一个Selection对象，如图。因为是一个光标，anchor和focus（选择的起点和终点）一样，偏移也一样。3、如图，则进行文字选择，而且是跨行选择，以第一行为起点，第二行为终点，选择文字。4、...
