在IE和FF下能用的，获取按钮在网页中的绝对位置
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>获取控件在网页中的绝对位置</title>
</head>
<body>
<div>如果您没有看到按钮，请往下拉到滚动条。</div>
<div style="height:500px;border:1px solid #6666CC;"> </div>
------------<input type="button" value="点我获取我的座标"
onclick="javascript:var pos = getCoordinate();alert('此按钮距页面左端 '+pos.x+' 像素，上端 '+pos.y+' 像素');" />
<script type="text/javascript" language="javascript">
function CPos(x, y)
{
this.x = x;
this.y = y;
}
// 取得事件（通用）
function $EVENTObject()
{
if(window.event) return window.event;
var f=$EVENTObject.caller;
while(f!=null)
{
var e = f.arguments[0];
if(e && (e.constructor==MouseEvent||e.constructor==Event||e.constructor==KeyboardEvent)) return e;
f=f.caller;
}
}
//取得触发本事件的元素（通用）
function getElement()
{
var _enent=$EVENTObject();
if(window.event)
{
return _enent.srcElement; //是IE
}else{
return _enent.target; //是FF
}
}
//取得 调用本方法的按钮 距离页面最上端和最左端的位置
function getCoordinate()
{
var target =getElement();
var pos = new CPos(target.offsetLeft, target.offsetTop);
var target = target.offsetParent;
while (target)
{
pos.x += target.offsetLeft;
pos.y += target.offsetTop;
target = target.offsetParent
}
return pos;
}
</script>
</body>
</html>
分享到：
相关推荐
首先，对于控件的坐标位置，ASP.NET网页不同于传统的桌面应用程序，因为Web是基于流式布局的，通常不直接支持绝对定位。然而，你可以通过操作HTML元素的`style`属性来实现类似的功能。例如，可以设置控件的`top`和`...
在本文中，我们将深入探讨如何使用JavaScript获取HTML控件的位置，以及不同浏览器之间可能存在的差异。 `offsetTop` 和 `offsetLeft` 是JavaScript中两个非常重要的属性，它们分别表示一个元素相对于其offsetParent...
描述中提到"自己制作控件实现网页获取窗体外鼠标坐标"，这可能是指在全屏模式下，通过JavaScript或者其他前端技术来监听鼠标移动事件，并计算出即使鼠标离开当前窗口，也能获取到其在屏幕上的绝对位置。"这只是个...
在本文中，我们将深入探讨FileUpload控件的基本用法，包括如何在网页中添加控件、处理文件上传事件以及确保上传的安全性。 首先，让我们了解如何在ASP.NET页面中添加FileUpload控件。在设计视图中，可以从工具箱中...
通过使用CreateWindow或CreateWindowEx函数，可以创建一个控件，并通过SetWindowLong、GetWindowLong等函数设置或获取控件属性。消息循环和消息处理是控件交互的关键，WM_COMMAND和WM_NOTIFY消息通常用于处理控件...
在本场景中，我们讨论的是一个基于js实现的GridView表格控件，它允许开发者创建功能丰富的数据展示网格，具备单选、多选以及对记录进行操作的能力。 GridView控件在Web开发中是常见的数据展示工具，通常用于显示...
在网页开发中，核心文件通常是指那些不可或缺的文件，比如JavaScript脚本文件和CSS样式表文件。对于QQ在线客服控件，这些核心文件可能包括用于处理用户交互逻辑的JS文件和定义控件外观样式的CSS文件。 1. **...
在给定的标题和描述中提到的“一款强大的时间控件”，指的是一个专为网页设计的交互式日历组件，能够增强用户在网页上管理、选择时间的体验。 【JSCal2-1.9】这是一个JavaScript库，专门用于创建这样的时间控件。...
在Delphi中，我们可以使用`TWebBrowser`控件来加载和显示网页，然后使用`IHTMLDocument2`接口来访问HTML文档对象模型（DOM），获取所有链接。此外，也可以使用` Indy`库创建自定义HTTP客户端，直接获取HTML源码并...
在网页开发中，可拖动Div控件是一种常见的交互元素，它允许用户通过鼠标操作将Div元素在页面上自由移动，提升用户体验。本教程将深入探讨如何使用JavaScript实现这一功能。 首先，我们要明白Div是HTML中的一个块级...
通过这种方式，我们可以创建一个功能齐全、易于使用的日历组件，使得用户在网页中选择日期变得直观且方便。在实际项目中，还可以根据需求进行扩展，如添加多语言支持、日期范围限制等高级功能。
它允许开发者在网页中嵌入动画、视频和其他交互式内容。尽管随着HTML5的兴起，Flash的重要性逐渐减弱，但在某些遗留系统和特定应用场景下，掌握其用法仍然是必要的。下面，我们将深入分析几个关键属性，帮助开发者更...
在JavaScript中，获取鼠标在页面上的绝对位置是一项常见的需求，这有助于实现如拖放功能、鼠标跟随效果等交互式功能。本文将详细介绍如何在不同浏览器环境下通过JavaScript获取鼠标绝对位置的方法。 首先，我们需要...
1. **控件简介**：在提供的代码示例中，涉及到的控件包括Command1（命令按钮）、List1（列表框）和Label3（标签）。 2. **控件使用**： - `Command1.Enabled=False`：禁用Command1按钮，防止用户在页面加载过程中...
这对于获取元素在页面视口中的绝对位置非常有用。 - `.position()`：返回元素相对于其最近的定位祖先元素（具有`position`非`static`的元素）的顶部和左侧的距离，不包括边距。 例如，获取并设置元素位置的示例： ...
纯JavaScript日历控件是一种基于Web的组件，它允许用户在网页上选择日期，而无需依赖任何特定的浏览器插件或服务器端技术。这个控件通常由JavaScript代码编写，因此可以跨平台运行，并且对浏览器的兼容性较高，能够...
JavaScript日期控件是一种常见的前端开发元素，用于在网页上提供日期选择功能，用户可以方便地选取日期，常用于表单填写、事件安排等场景。在这个案例中，我们关注的是一个名为"JavaScript日期控件01（日期选择器）...
本教程将深入探讨如何在网页中插入图片，这是构建交互式、视觉吸引力强的网站时一个非常重要的步骤。以下是对这个主题的详细讲解： 1. HTML基础 在网页中插入图片，最常用的方法是通过HTML的`<img>`标签。该标签...
在网页设计中，我们经常需要使用到`<input type="file">`标签来实现文件上传功能，但默认的上传控件样式通常较为简单，不符合现代网页的美观需求。本篇将探讨如何自定义`input file`的样式，打造个性化的上传界面。 ...