28,390
社区成员
发帖
与我相关
我的任务
分享取得部件的屏幕位置
我想问一下,如何在ie窗口中,用jscript取得 页面中某个部件相对ie窗口客户区的绝对位置,就象api中的clienttoscreen函数.
比如一个text文本框,在一个table中,如何取得他的绝对位置,相对于ie窗口的坐标.
如果有例子,更好.实在懒得看msdn,太多了.
比如一个text文本框,在一个table中,如何取得他的绝对位置,相对于ie窗口的坐标.
如果有例子,更好.实在懒得看msdn,太多了.
...全文
请发表友善的回复…
发表回复
mygia 2004-11-19
- 打赏
- 举报
居然有这种功能，好，学习！
hdqqq 2004-11-19
- 打赏
- 举报
getElementByID("Text1").offsetLeft
我试过了offsetLeft不会随着text1位置的变化而变化.
我试过了offsetLeft不会随着text1位置的变化而变化.
hdqqq 2004-11-19
- 打赏
- 举报
大家可以看看上面这个网页,其中在div里面有个text1,div是可以通过滚动条滚动的,同时text1的屏幕位置随着改变,问题是如何取得text1的屏幕位置.
hdqqq 2004-11-19
- 打赏
- 举报
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML xmlns:MSHelp="http://msdn.microsoft.com/msHelp">
<HEAD>
<TITLE>Untitled</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=iso-8859-1">
<META NAME="AUTHOR" CONTENT="InetSDK">
<META NAME="MS.LOCALE" CONTENT="EN-US">
<META NAME="ROBOTS" CONTENT="noindex">
<LINK REL="stylesheet" HREF="/workshop/samples/author/dhtml/refs/samplesSDKIE4.css" TYPE="text/css">
<SCRIPT>
function fnCheckScroll(){
var newheight = oID_1.scrollHeight;
alert("The value of the scrollHeight property is " + newheight + " pixels");
setPos();
}
</SCRIPT>
<LINK REL="stylesheet" TYPE="text/css" HREF="ms-help://Hx/HxRuntime/HxLink.css">
<STYLE TYPE="text/css"> PRE.clsCode { font-size:110%; }
PRE.clsSyntax { font-size:100%; }
TD DIV.clsBeta { display:none;}
MSHelp\:link { color:#0000ff; text-decoration:underline; cursor:hand; hoverColor:#3366ff; filterString: ;}
</STYLE>
<!--TOOLBAR_START-->
<!--TOOLBAR_EXEMPT-->
<!--TOOLBAR_END-->
</HEAD>
<BODY TOPMARGIN="0" LEFTMARGIN="0" BGPROPERTIES="fixed" BGCOLOR="#ffffff" LINK="#000000"
VLINK="#808080" ALINK="#000000">
<BLOCKQUOTE CLASS="body">
<H4>scrollHeight Property Sample</H4>
<P>This sample will demonstrate the use of the <B>scrollHeight</B> property to
retrieve the height of the viewable content.</P>
<DIV ID="oID_1" STYLE="OVERFLOW:scroll; WIDTH:150px; HEIGHT:200px; TEXT-ALIGN:left">The
<B>scrollHeight</B> property is read-only, allowing you to obtain the height
actually needed in the scrolling. Even though the height of this <B>DIV</B> is
200, the height inside the scrolling text box may be less, since the wrapping
of the text may mean that not the entire width of the object is used. This
dimension may be useful for a variety of reasons; for example, the height of
the <B>DIV</B> could be set to the <B>scrollHeight</B> to conserve horizontal
space while respecting the set width as a maximum.<INPUT id="Text1" type="text" name="Text1">
</DIV>
<BR>
<input type="button" value="Check scrollHeight" onclick="fnCheckScroll()">
<HR>
<p style="TEXT-ALIGN: center">[right-click anywhere in this window to view the
source code]
</p>
<!-- START_PAGE_FOOTER -->
<BR>
<BR>
<BR>
<MSHelp:link xmlns:MSHelp="http://msdn.microsoft.com/mshelp" keywords="msdn_copyright" TABINDEX="0">© 2003 Microsoft Corporation. All rights reserved.</MSHelp:link>.
<!-- END_PAGE_FOOTER -->
</BLOCKQUOTE>
</BODY>
</HTML>
<HTML xmlns:MSHelp="http://msdn.microsoft.com/msHelp">
<HEAD>
<TITLE>Untitled</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=iso-8859-1">
<META NAME="AUTHOR" CONTENT="InetSDK">
<META NAME="MS.LOCALE" CONTENT="EN-US">
<META NAME="ROBOTS" CONTENT="noindex">
<LINK REL="stylesheet" HREF="/workshop/samples/author/dhtml/refs/samplesSDKIE4.css" TYPE="text/css">
<SCRIPT>
function fnCheckScroll(){
var newheight = oID_1.scrollHeight;
alert("The value of the scrollHeight property is " + newheight + " pixels");
setPos();
}
</SCRIPT>
<LINK REL="stylesheet" TYPE="text/css" HREF="ms-help://Hx/HxRuntime/HxLink.css">
<STYLE TYPE="text/css"> PRE.clsCode { font-size:110%; }
PRE.clsSyntax { font-size:100%; }
TD DIV.clsBeta { display:none;}
MSHelp\:link { color:#0000ff; text-decoration:underline; cursor:hand; hoverColor:#3366ff; filterString: ;}
</STYLE>
<!--TOOLBAR_START-->
<!--TOOLBAR_EXEMPT-->
<!--TOOLBAR_END-->
</HEAD>
<BODY TOPMARGIN="0" LEFTMARGIN="0" BGPROPERTIES="fixed" BGCOLOR="#ffffff" LINK="#000000"
VLINK="#808080" ALINK="#000000">
<BLOCKQUOTE CLASS="body">
<H4>scrollHeight Property Sample</H4>
<P>This sample will demonstrate the use of the <B>scrollHeight</B> property to
retrieve the height of the viewable content.</P>
<DIV ID="oID_1" STYLE="OVERFLOW:scroll; WIDTH:150px; HEIGHT:200px; TEXT-ALIGN:left">The
<B>scrollHeight</B> property is read-only, allowing you to obtain the height
actually needed in the scrolling. Even though the height of this <B>DIV</B> is
200, the height inside the scrolling text box may be less, since the wrapping
of the text may mean that not the entire width of the object is used. This
dimension may be useful for a variety of reasons; for example, the height of
the <B>DIV</B> could be set to the <B>scrollHeight</B> to conserve horizontal
space while respecting the set width as a maximum.<INPUT id="Text1" type="text" name="Text1">
</DIV>
<BR>
<input type="button" value="Check scrollHeight" onclick="fnCheckScroll()">
<HR>
<p style="TEXT-ALIGN: center">[right-click anywhere in this window to view the
source code]
</p>
<!-- START_PAGE_FOOTER -->
<BR>
<BR>
<BR>
<MSHelp:link xmlns:MSHelp="http://msdn.microsoft.com/mshelp" keywords="msdn_copyright" TABINDEX="0">© 2003 Microsoft Corporation. All rights reserved.</MSHelp:link>.
<!-- END_PAGE_FOOTER -->
</BLOCKQUOTE>
</BODY>
</HTML>
TSD 2004-11-19
- 打赏
- 举报
getElementByID("TS").offsetLeft
ygjwjj 2004-11-19
- 打赏
- 举报
function getPos(cell)
{
var pos = new Array();
var t=cell.offsetTop;
var l=cell.offsetLeft;
while(cell=cell.offsetParent)
{
t+=cell.offsetTop;
l+=cell.offsetLeft;
}
pos[0] = t;
pos[1] = l;
return pos;
}
//alert(getPos(document.all.yourTableName)[0]) //top
//alert(getPos(document.all.yourTableName)[1]) //left
function setPos()
{
document.all.Layer1.style.left = getPos(document.all.Layer1)[1];
document.all.Layer1.style.top = getPos(document.all.Layer1)[0];
}
{
var pos = new Array();
var t=cell.offsetTop;
var l=cell.offsetLeft;
while(cell=cell.offsetParent)
{
t+=cell.offsetTop;
l+=cell.offsetLeft;
}
pos[0] = t;
pos[1] = l;
return pos;
}
//alert(getPos(document.all.yourTableName)[0]) //top
//alert(getPos(document.all.yourTableName)[1]) //left
function setPos()
{
document.all.Layer1.style.left = getPos(document.all.Layer1)[1];
document.all.Layer1.style.top = getPos(document.all.Layer1)[0];
}
hdqqq 2004-11-19
- 打赏
- 举报
只不常写网页而已.
hdqqq 2004-11-19
- 打赏
- 举报
shaolin131083(达到)
你算什么东西,以为会编网页就算了得.我碰电脑的时候你还不知道在那个角落里呢.
你算什么东西,以为会编网页就算了得.我碰电脑的时候你还不知道在那个角落里呢.
hdqqq 2004-11-19
- 打赏
- 举报
如果text是在一个div中,div是可以滚动的,就是有滚动条,我如何得到text的屏幕位置?
象这样
<DIV ID="oID_1" STYLE="OVERFLOW:scroll; WIDTH:150px; HEIGHT:200px; TEXT-ALIGN:left">The
<B>scrollHeight</B> property is read-only, allowing you to obtain the height
actually needed in the scrolling. Even though the height of this <B>DIV</B> is
200, the height inside the scrolling text box may be less, since the wrapping
of the text may mean that not the entire width of the object is used. This
dimension may be useful for a variety of reasons; for example, the height of
the <B>DIV</B> could be set to the <B>scrollHeight</B> to conserve horizontal
space while respecting the set width as a maximum.<INPUT id="Text1" type="text" name="Text1">
</DIV>
象这样
<DIV ID="oID_1" STYLE="OVERFLOW:scroll; WIDTH:150px; HEIGHT:200px; TEXT-ALIGN:left">The
<B>scrollHeight</B> property is read-only, allowing you to obtain the height
actually needed in the scrolling. Even though the height of this <B>DIV</B> is
200, the height inside the scrolling text box may be less, since the wrapping
of the text may mean that not the entire width of the object is used. This
dimension may be useful for a variety of reasons; for example, the height of
the <B>DIV</B> could be set to the <B>scrollHeight</B> to conserve horizontal
space while respecting the set width as a maximum.<INPUT id="Text1" type="text" name="Text1">
</DIV>
micher_yan 2004-11-19
- 打赏
- 举报
<html>
<head>
<title>t</title>
<script language="VBScript">
sub showXY
msgbox Layer1.style.left
end sub
</script>
</head>
<body>
<div id="Layer1" style="position:absolute; left:152px; top:123px; width:214px; height:68px; z-index:1">asdf</div>
<form name="form1" method="post" action="">
<input type="button" name="Button" value="Button" onClick="showXY">
</form>
</body>
</html>
如果你把文本框等东西放在div标记中就行，这个东西支持坐标
<head>
<title>t</title>
<script language="VBScript">
sub showXY
msgbox Layer1.style.left
end sub
</script>
</head>
<body>
<div id="Layer1" style="position:absolute; left:152px; top:123px; width:214px; height:68px; z-index:1">asdf</div>
<form name="form1" method="post" action="">
<input type="button" name="Button" value="Button" onClick="showXY">
</form>
</body>
</html>
如果你把文本框等东西放在div标记中就行，这个东西支持坐标
