`
apple_wxs
  • 浏览: 104405 次
  • 性别: Icon_minigender_1
  • 来自: 大连
社区版块
存档分类
最新评论

找某个控件的坐标动态显示div（支持ie和ff）

IE 
阅读更多
看下面的例子，里面提供了一个得到元素绝对位置（坐标）的方法getElementPos(obj) 
<HTML>
 <BODY>
 <div id="mydiv" style="position:absolute; display:none; background:#FF9933; height:80;width:120;"> I am div ^_^</div>
 点击showDiv按钮在文本框下面出现一个DIV<br>
 <table border=1>
	<tr>
		<td>
			<table border=1>
				<tr>
					<td>aa</td>
					<td>
						<input type="text" id="test">
						<button onclick="showDiv()">showDiv</button>
					</td>
				</tr>
			</table>
		</td>
	</tr>
  </table>

  <SCRIPT LANGUAGE="JavaScript">
  <!--
//得到某一元素的绝对位置,不管该元素嵌套在多复杂的位置里
function getElementPos(obj)
{
	var left = 0;
	var top = 0;

	if(obj.x)
	{
		left= obj.x;
		top = obj.y;
	}else if(obj.offsetParent)
	{	
		while(obj.offsetParent)
		{		
			left += obj.offsetLeft;
			top  += obj.offsetTop;
			obj = obj.offsetParent;
		} 
	}

	return [left,top];//封装在一个数组里
}
function showDiv()
{
	var mydiv = document.getElementById("mydiv");
	var pos = getElementPos(document.getElementById("test"));
	mydiv.style.display = "";

	mydiv.style.left = pos[0];
	mydiv.style.top = pos[1] + document.getElementById("test").offsetHeight;
}
  //-->
  </SCRIPT>
 </BODY>
</HTML>
分享到：
| Js中sort()方法的用法
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    [资源分享]解决Win10下IE浏览器树形控件treeview无法显示的问题

    3. **JavaScript和CSS错误**：树形控件的显示可能依赖于JavaScript代码来动态构建和操作DOM。检查网页源代码，查找可能的JavaScript错误或CSS样式问题。使用开发者工具（F12键打开）可以帮助定位和修复这些问题。 4...

    js日期控件 支持IE、firefox、chrome

    日期控件就是利用JavaScript实现的一种动态显示和选择日期的组件。它通常通过添加事件监听、DOM操作和自定义样式来创建。 标题中的"支持IE、firefox、chrome"表明这个日期控件特别强调了对这三个浏览器的兼容性。IE...

    js日期控件，完美支持IE8，支持多种浏览器

    在本文中，我们将深入探讨一个名为"My97 DatePicker"的JS日期控件，它以其对IE8的完美支持以及对其他多种浏览器的良好兼容性而备受赞誉。 首先，我们要了解JavaScript在处理日期时的基本概念。JavaScript内置的`...

    VBnet004-鼠标坐标动态显示

    VBnet004-鼠标坐标动态显示 源代码，"鼠标位置(" + e.X.ToString() + "," + e.Y.ToString() + ")

    c#WinForm直角坐标系显示自定义控件

    使用graphics类绘制直角坐标系下的图像，调用本控件可以直接在坐标图上标出坐标，并实施显示当前坐标的位置，及当前鼠标所处位置。 本自定义控件还可以自动选择坐标轴的长度，可以清楚当前的图像，并且使用了两个...

    VS2010picture控件显示图片，显示坐标

    通过以上步骤，你可以在VS2010的C++环境中实现图片的真实大小显示，并动态地显示鼠标在图片上的位置坐标。请注意，这里的代码示例基于MFC框架，如果你使用的是WinAPI或其他框架，部分API和方法会有所不同。

    C# 地图显示缩放 坐标系动态显示

    通过阅读和分析这些代码，可以更深入地理解地图显示、坐标系转换、动态缩放和坐标轴绘制的具体实现。 总之，“C# 地图显示缩放 坐标系动态显示”项目涵盖了C#中的图形绘制、地图数据处理、坐标转换和用户交互等多个...

    基于C#的波形显示控件的实现源码

    本课题设计的波形显示控件实现了同时显示多条数据曲线、局部放大查看、波形显示自动调整最佳坐标范围、动态显示波形等功能。创新之处在于设计了一种方法，使得波形显示控件的坐标轴的起点值和终点值能够以浮点数显示...

    C# 曲线图坐标系控件

    "C# 曲线图坐标系控件"是专为这个目的设计的，它允许开发者在应用程序中绘制曲线图，并且支持自定义坐标系和自动缩放功能。这种控件在数据分析、科学计算、工程应用等领域非常有用。 首先，我们要理解什么是坐标系...

    VS2013MFC获取鼠标位于picture控件实时坐标，和点击处坐标

    // IDC_STATIC_INFO为显示坐标信息的静态文本控件ID CDialogEx::OnMouseMove(nFlags, point); } void CMFCApplication1Dlg::OnLButtonDown(UINT nFlags, CPoint point) { // 获取鼠标点击坐标 CString str; ...

    Qt 坐标轴控件

    * @details 坐标轴控件 只有刻度和数字，数字可以隐藏(用来显示其他需要显示的刻度值) */ class uiAxis : public QWidget { Q_OBJECT public: /** @brief 坐标轴类型 * * @details 坐标轴类型 */ enum ...

    IE浏览器控件管理程序（删除IE控件）

    "IE浏览器控件管理程序"是一个专门针对这种情况设计的工具，它允许用户查看和管理在IE浏览器上安装的所有控件，包括删除那些可能对系统安全构成威胁的控件。这个程序能够帮助用户保持浏览器环境的清洁和安全，避免...

    兼容ff和ie的日历控件 js

    从给定的文件标题、描述、标签以及部分内容中，我们可以提炼出关于“兼容FF和IE的日历控件JS”的详细知识点。以下是对这些知识点的深入解析： ### 标题：“兼容ff和ie的日历控件 js” #### 知识点1：兼容性问题 ...

    MFC获取picture控件的鼠标点击坐标位置的方法

    MFC 获取 Picture 控件的鼠标点击坐标位置的方法 在 MFC 编程中，获取 Picture 控件的鼠标...需要注意的是，在获取 Picture 控件的鼠标点击坐标位置时，需要根据实际情况进行调整和修改代码，以适应不同的需求和场景。

    Teechart控件设置坐标轴范围.txt

    Teechart控件设置坐标轴范围.zip Teechart控件设置坐标轴范围.zip Teechart控件设置坐标轴范围.zip Teechart控件设置坐标轴范围.zip Teechart控件设置坐标轴范围.zip

    my97日历控件跟ie8不兼容 解决方案

    开启此模式可能让my97日历控件在IE8下正常工作，但这不是长久之计，因为这会影响其他网站的正常显示。 3. **使用polyfill库**：如果my97日历控件依赖的特性是ES5以后引入的，可以引入相应的polyfill库，如es5-shim...

    js日历控件chrom ie ff

    支持chrom ie ff 的js日历控件。版权KimSoft (jinqinghua@gmail.com)。在此基础上做如下修改： a) 为时间input控件加入onchange事件触发代码； b) 年选择的宽度从64px增加到66px； c)如果input值不为空，那么再次...

    微信小程序 实现动态显示和隐藏某个控件

    微信小程序实现动态显示和隐藏某个控件 微信小程序实现动态显示和隐藏某个控件是小程序开发中的一种常见需求。在小程序的开发过程中，经常需要用到隐藏某个控件这种情况。因为项目原本是需要将两个canvas切换，但是...

    LABVIEW中动态添加控件

    标题提到的“动态添加控件”是LabVIEW的一项重要特性，允许用户在程序运行时动态地向用户界面（Front Panel）添加、修改或删除控件，增强了程序的灵活性和交互性。 动态添加控件通常涉及以下知识点： 1. **VI引用*...

    MFC画二维坐标点控件

    在`OnPaint()`中，首先清除画布，然后根据当前的缩放和平移参数重新绘制坐标点和坐标轴。 8. **消息映射**：在`hnPointsShow`类的头文件中，我们需要定义消息映射，将各种消息（如鼠标和键盘事件）映射到相应的处理...

Magicbox
Global site tag (gtag.js) - Google Analytics