📄 wm_pos2_elmnt.html
字号:
posR.top = 0;
// For some reason IE was adding four pixels.
// I subtracted it here.
posR.width = document.body.offsetWidth - 4;
posR.height = document.body.offsetHeight - 4;
} else if (document.layers) {
posR = document;
posR.left = 0;
posR.top = 0;
posR.width = this.window.innerWidth;
posR.height = this.window.innerHeight;
// You need to set the width and height manually for Netscape.
// You can do this based on its clip.
posE.width = posE.clip.width;
posE.height = posE.clip.height;
}
} else {
// This is for positioning your element based on another element.
// First, the standard checkIn procedure to conditionalize around
// the differences in the DOMs. You can replace this with any
// function that returns an object reference to a DHTML object.
posR = WM_checkIn(arguments[3]);
// Netscape doesn't know the object's width, only its
// clip.width, so I construct all that here.
if (document.layers) {
posE.width = posE.clip.width;
posE.height = posE.clip.height;
posR.width = posR.clip.width;
posR.height = posR.clip.height;
}
}
// This is where the faux properties are constructed. Right and
// bottom are equal to width and height, but I still use them,
// because it's easier to construct references to them based on
// the arguments later on.
posE.right = parseInt(posE.width);
posE.bottom = parseInt(posE.height);
posR.right = parseInt(posR.left) + parseInt(posR.width);
posR.bottom = parseInt(posR.top) + parseInt(posR.height);
// This is where all that conditional work comes into play - the
// algorithm for the actual positioning. This is also where the
// difference between left and right or top and bottom is handled,
// through the setting of the mod[ifier] variable.
if((arguments[1] == 'left') || (arguments[1] == 'right')) {
if(arguments[1] == 'left') mod = 0;
if(arguments[1] == 'right') mod = posE.right * -1;
posE.left = parseInt(posR[arguments[4]]) + parseInt(arguments[2]) + mod;
}
if((arguments[1] == 'top') || (arguments[1] == 'bottom')) {
if(arguments[1] == 'top') mod = 0;
if(arguments[1] == 'bottom') mod = posE.bottom * -1;
posE.top = parseInt(posR[arguments[4]]) + parseInt(arguments[2]) + mod;
}
}
// -->
</script>
</textarea><script language="JavaScript">
function WM_position2element() {
/*
WM_position2element()
Author: Taylor
Author Email: taylor@wired.com
Author URL: http://www.taylor.org/
URL: http://www.hotwired.com/webmonkey/code_library/dhtml/wm_position2element/
This action positions one DHTML element a specified number of
pixels away from another, based on the left, top, right, or
bottom of the bounding box of each element. To use it, you must
choose the element to position and the element to position against;
specify which side of each element's bounding box to base the
positioning on; and supply the number of pixels difference between
the two. Optionally, you can choose the browser window as the
element to position against by using the string "window".
You can only position either the left or the top of an element
on each function call, not both at once, so multiple calls will
be necessary if you want to offset the positioned element in two
dimensions at once. This also only updates the element once, so
if you want elements to follow each other in formation you'll
need to call the function multiple times.
Usage: WM_position2element(elementPositioned,
left|top|right|bottom, differenceInPixels,
elementPositionedAgainst|window, left|top|right|bottom);
*/
// First we set up our variables. posE is short for positionEE
// and posR is short for positionER.
var posE,posR,mod;
with(WM_position2element);
posE = WM_checkIn(arguments[0]);
// This block of code takes the string 'window' and makes it mean
// the browser window. This is handled in very different ways by
// Netscape and IE, so this block of code is rather long.
if (arguments[3] == 'window') {
if (document.all){
posR = document.body;;
posR.left = 0;
posR.top = 0;
// For some reason IE was adding four pixels.
// I subtracted it here.
posR.width = document.body.offsetWidth - 4;
posR.height = document.body.offsetHeight - 4;
} else if (document.layers) {
posR = document;
posR.left = 0;
posR.top = 0;
posR.width = this.window.innerWidth;
posR.height = this.window.innerHeight;
// You need to set the width and height manually for Netscape.
// You can do this based on its clip.
posE.width = posE.clip.width;
posE.height = posE.clip.height;
}
} else {
// This is for positioning your element based on another element.
// First, the standard checkIn procedure to conditionalize around
// the differences in the DOMs. You can replace this with any
// function that returns an object reference to a DHTML object.
posR = WM_checkIn(arguments[3]);
// Netscape doesn't know the object's width, only its
// clip.width, so I construct all that here.
if (document.layers) {
posE.width = posE.clip.width;
posE.height = posE.clip.height;
posR.width = posR.clip.width;
posR.height = posR.clip.height;
}
}
// This is where the faux properties are constructed. Right and
// bottom are equal to width and height, but I still use them,
// because it's easier to construct references to them based on
// the arguments later on.
posE.right = parseInt(posE.width);
posE.bottom = parseInt(posE.height);
posR.right = parseInt(posR.left) + parseInt(posR.width);
posR.bottom = parseInt(posR.top) + parseInt(posR.height);
// This is where all that conditional work comes into play - the
// algorithm for the actual positioning. This is also where the
// difference between left and right or top and bottom is handled,
// through the setting of the mod[ifier] variable.
if((arguments[1] == 'left') || (arguments[1] == 'right')) {
if(arguments[1] == 'left') mod = 0;
if(arguments[1] == 'right') mod = posE.right * -1;
posE.left = parseInt(posR[arguments[4]]) + parseInt(arguments[2]) + mod;
}
if((arguments[1] == 'top') || (arguments[1] == 'bottom')) {
if(arguments[1] == 'top') mod = 0;
if(arguments[1] == 'bottom') mod = posE.bottom * -1;
posE.top = parseInt(posR[arguments[4]]) + parseInt(arguments[2]) + mod;
}
}
</script> </font></p>
</form>
<p><font face="宋体"><br>
<!-- AUTHOR TAGLINE --> </font></font></td>
</tr>
<tr>
<td width="155" valign="bottom" bgcolor="#FFFFB5"><font face="宋体"><br>
</font><font size="2" face="宋体">问题? 建议? 请<a href="mailto:bruce@itc.cn.net">告诉</a>网猴。</font></td>
</tr>
</table>
<p><font face="宋体"><br>
</font></p>
</body>
</html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -