<script type="text/javascript">
function getAbsoluteLocation(element) {
if (!element) {
return null;
}
var offsetTop = element.offsetTop;
var offsetLeft = element.offsetLeft;
var offsetWidth = element.offsetWidth;
var offsetHeight = element.offsetHeight;
while (element = element.offsetParent) {
if (element.style.position == 'absolute' || element.style.position == 'relative' || (element.style.overflow != 'visible' && element.style.overflow != '')) {
break;
}
offsetTop += element.offsetTop;
offsetLeft += element.offsetLeft;
}
return {
top: offsetTop,
left: offsetLeft,
width: offsetWidth,
height: offsetHeight
};
}
function test(){
var _sapn = document.getElementById("yj_span");
var pos = getAbsoluteLocation(_sapn);
var _div = document.createElement('div');
body.appendChild(_div);
_div.style.background = '#6600FF';
_div.style.position = 'absolute';
_div.style.width = pos.width;
_div.style.top = pos.top + pos.height;
_div.style.left = pos.left;
_div.innerHTML="YongJie";
}
</script>
<body id="body" onload="test();">
<div style=" width:50%; text-align:center; background-color:#CCCCCC">
<div style=" width:50%; background-color:#33FFFF">
<span id="yj_span" style=" width:50%; background-color:#6633FF; margin:20 0 50 30px; padding:20px; border:10px inset #FF0000;">hyj</span>
</div>
</div>
</body>
分享到：
相关推荐
在JavaScript中，获取鼠标的绝对位置是常见的需求，特别是在实现交互式用户界面或者进行鼠标跟踪时。`event`对象是JavaScript中的一个内置对象，它包含了有关当前事件（如鼠标点击或移动）的各种信息，其中包括鼠标...
2. **取得控件绝对位置**：在JavaScript中获取控件的绝对位置是通过DOM操作实现的。可以使用`getBoundingClientRect()`方法，它返回元素的大小及其相对于视口的位置。通过这个信息，我们可以确保下拉菜单在输入框的...
首先，对于控件的坐标位置，ASP.NET网页不同于传统的桌面应用程序，因为Web是基于流式布局的，通常不直接支持绝对定位。然而，你可以通过操作HTML元素的`style`属性来实现类似的功能。例如，可以设置控件的`top`和`...
JavaScript日期控件是一种常见的前端开发元素，用于在网页上提供日期选择功能，用户可以方便地选取日期，常用于表单填写、事件安排等场景。在这个案例中，我们关注的是一个名为"JavaScript日期控件01（日期选择器）...
JavaScript获取鼠标坐标是Web开发中的常见需求，尤其在交互式应用和动态效果中扮演着重要角色。本篇文章将详细介绍各种JavaScript方法来获取鼠标位置，并解释它们的用途和差异。 首先，我们可以使用`event`对象来...
在JavaScript和jQuery的世界里，获取元素的绝对位置是一项常见的需求，尤其在动态定位元素或创建交互效果时。本文将详细讲解如何使用jQuery获取点击控件的绝对位置，并通过一个简单的实例来阐述整个过程。 首先，...
在本文中，我们将深入探讨如何使用JavaScript获取HTML控件的位置，以及不同浏览器之间可能存在的差异。 `offsetTop` 和 `offsetLeft` 是JavaScript中两个非常重要的属性，它们分别表示一个元素相对于其offsetParent...
本文将详细介绍如何在不同浏览器环境下通过JavaScript获取鼠标绝对位置的方法。 首先，我们需要了解不同浏览器对于鼠标事件对象(event object)中的位置属性的处理差异。在Internet Explorer（IE）中，`event.x` 和 ...
JavaScript日历是一款在网页中使用的交互式日历控件，它可以提供用户友好的日期选择功能，常见于在线表单、事件预订系统等场景。这款日历控件的独特之处在于它能够防止自身被页面上的其他元素遮挡，解决了JavaScript...
这个控件的实现通常涉及到JavaScript（JS）特效和CSS（Cascading Style Sheets）布局技术，使得客服窗口能够在页面底部始终保持可见，无论用户滚动到哪里。下面将详细介绍这个控件的工作原理和实现方法。 首先，...
9. 获取控件的绝对位置：JavaScript 和 VBScript 提供了获取元素绝对位置的方法，例如 `getIE()` 函数可以获取指定元素相对于文档的顶部和左侧距离。 10. 文本框光标定位：`<script language="javascript">function...
JSCal2利用JavaScript的事件处理、DOM操作和AJAX（异步JavaScript和XML）等功能，实现在网页上与用户交互的时间选择功能，而无需刷新整个页面。 【Web开发】在Web开发中，时间控件通常被应用于各种场景，如在线预订...
首先，我们来了解一下如何通过jQuery获取页面元素的绝对位置。绝对位置指的是元素相对于整个文档左上角（通常是指标签）的位置。jQuery提供了一个非常方便的方法叫做`offset()`，它可以返回元素相对于文档的偏移量。...
在网页开发中，可拖动Div控件是一种常见的交互元素，它允许用户通过鼠标操作将Div元素在页面上自由移动，提升用户体验。本教程将深入探讨如何使用JavaScript实现这一功能。 首先，我们要明白Div是HTML中的一个块级...
2.7 取得控件的绝对位置 2.8 删除时的确认提 示 2.9 按钮只能单击一次 2.10 防止按钮连击 2.11 图片式按钮 2.12 文字显示在按钮底部 2.13 选择不同的列表项就显示不同的按钮 2.14 使用按钮控制文本渐变 2.15 翻页...
描述中提到"自己制作控件实现网页获取窗体外鼠标坐标"，这可能是指在全屏模式下，通过JavaScript或者其他前端技术来监听鼠标移动事件，并计算出即使鼠标离开当前窗口，也能获取到其在屏幕上的绝对位置。"这只是个...
JavaScript（简称js）是一种轻量级的脚本语言，广泛应用于网页和网络应用开发，包括创建动态和交互式的用户界面。在本场景中，我们讨论的是一个基于js实现的GridView表格控件，它允许开发者创建功能丰富的数据展示...
11. 获取控件的绝对位置，JavaScript 和 VBScript 提供了不同的方法，通过遍历元素的offsetParent属性来计算其相对于文档顶部和左边的位置。 12. `onfocus="cc()"` 使得文本框获取焦点时，光标自动移动到文字的末尾...