javascript和jquery窗口定位方法对应表
来源:互联网 发布:淘宝手机端倒计时代码 编辑:程序博客网 时间:2024/06/04 08:03
转载 http://www.cnblogs.com/Cohlint/archive/2012/08/29/2661921.html
位置
javascript
jquery
兼容性窗口位置离屏幕左偏移
var leftPos = (typeof window.screenLeft == "number") ? window.screenLeft : window.screenX; 浏览器兼容性问题可能不准确,建议用moveTo窗口位置离屏幕上偏移
var topPos = (typeof window.screenTop == "number") ? window.screenTop : window.screenY; 浏览器兼容性问题可能不准确,建议用moveTo
窗口定位到某位置
window.moveTo(0,0) Opera及IE7+默认禁用,且不适用于框架窗口定位相对位置
window.moveBy(50,50) Opera及IE7+默认禁用,且不适用于框架
窗口调整大小1window.resizeTo(100,100) 窗口调用大小2window.resizeTBy(100,50) 页面视口大小 var pageWidth = window.innerWidth,pageHeight = window.innerHeight;
if (typeof pageWidth != "number"){
if (document.compatMode == "CSS1Compat"){
pageWidth= document.documentElement.clientWidth;
pageHeight = document.documentElement.clientHeight;
} else {
pageWidth = document.body.clientWidth;
pageHeight = document.body.clientHeight;
}
}$(window).width()
$(window).height() 元素距页面顶部偏移量 function getElementTop(element){
var actualTop = element.offsetTop;
var current = element.offsetParent;
while (current !== null){
actualTop += current.offsetTop;
current = current.offsetParent;
}
return actualTop;
}$(element).offset().topjs为递归计算,只对可见元素有效元素距页面左侧偏移量 function getElementLeft(element){
var actualLeft = element.offsetLeft;
var current = element.offsetParent;
while (current !== null){
actualLeft += current.offsetLeft;
current = current.offsetParent;
}
return actualLeft;
}
$(element).offset().left
js为递归计算,只对可见元素有效
元素在垂直方向上占用空间(含边框+内边距+滚动条)element.offsetHeight$(element).outerHeight(), 元素在水平方向上占用空间(含边框+内边距+滚动条)
element.offsetWidth$(element).outerWidth(), 元素在垂直方向上占用空间(不含边框,滚动条只含内边距)
element.clientHeight
$(element).height(),有区别,不含内边距
元素在水平方向上占用空间(不含边框,滚动条,只含内边距)
element.clientWidth
$(element).width(),有区别,不含内边距
在没有滚动条时,元素内容总高度element.scrollHeight
jquery未找到对应方法
var docHeight = Math.max(document.documentElement.scrollHeight,document.documentElement.clientHeight);
在没有滚动条时,元素内容总宽度
element.scrollWidth
jquery未找到对应方法var docWidth = Math.max(document.documentElement.scrollWidth,document.documentElement.clientWidth);已被滚动卷去的上方像素
var top = document.body.scrollTop | document.documentElement.scrollTop;
$(document).scrollTop()
可以用此方法滚动到指定位置已被滚动卷去的左方像素
var left = document.body.scrollLeft | document.documentElement.scrollLeft;
$(document).scrollLeft()
可以用此方法滚动到指定位置
兼容所有浏览器,
取得元素矩阵,返回
元素左上角坐标距
视窗口的
left,top,right,bottom值
function getElementLeft(element){var actualLeft = element.offsetLeft;
var current = element.offsetParent;
while (current !== null){
actualLeft += current.offsetLeft;
current = current.offsetParent;
}
return actualLeft;
}
function getElementTop(element){
var actualTop = element.offsetTop;
var current = element.offsetParent;
while (current !== null){
actualTop += current. offsetTop;
current = current.offsetParent;
}
return actualTop;
}
function getBoundingClientRect(element){
var scrollTop = document.documentElement.scrollTop;
var scrollLeft = document.documentElement.scrollLeft;
if (element.getBoundingClientRect){
if (typeof arguments.callee.offset != "number"){
var temp = document.createElement("div");
temp.style.cssText = "position:absolute;left:0;top:0;";
document.body.appendChild(temp);
arguments.callee.offset = -temp.getBoundingClientRect().top - scrollTop;
document.body.removeChild(temp);
temp = null;
}
var rect = element.getBoundingClientRect();
var offset = arguments.callee.offset;
return {
left: rect.left + offset,
right: rect.right + offset,
top: rect.top + offset,
bottom: rect.bottom + offset
};
} else {
var actualLeft = getElementLeft(element);
var actualTop = getElementTop(element);
return {
left: actualLeft - scrollLeft,
right: actualLeft + element.offsetWidth - scrollLeft,
top: actualTop - scrollTop,
bottom: actualTop + element.offsetHeight - scrollTop
}
}
}
0 0
- javascript和jquery窗口定位方法对应表
- JavaScript和jQuery实现定位导航功能
- 定位cpu占用过高的线程和对应的方法
- JQuery Mobile Popup窗口定位
- JavaScript与jQuery中获取屏幕的宽度和高度的常用方法以及HTML中精确定位
- selenium使用Xpath+CSS+JavaScript+jQuery的定位方法(专治各种定位不准并发症)
- 窗口发生改变事件 定位 jquery
- jquery 和 javascript 清空下传控件 方法总结
- jquery和javascript常用方法的区别
- jQuery和javascript获取临近节点方法
- javaScript和jQuery自动加载方法
- jquery和javascript常用方法比较
- jQuery和javascript获取临近节点方法
- js jquery父窗口调用子窗口中的方法和子窗口调用父窗口里的方法
- 前端javascript调试和定位工具VisualEvent和chrome自带定位方法
- Jquery 页面定位的方法
- jquery子窗口给父窗口元素赋值和获得值,子窗口调取父窗口方法,父窗口调取子窗口方法
- selenium使用Xpath+CSS+JavaScript+jQuery的定位方法(治疗selenium各种定位不到,点击不了的并发症)
- 设计模式学习笔记---原型模式prototype(Java版)
- Spring Security3.x 入门教程
- 从零开始学习unity挖坑之路二
- OC 常用API
- Surround the Trees(hdu 1392)
- javascript和jquery窗口定位方法对应表
- JAVA容器基本概念
- 路由环路的产生及解决方案
- 获取文件的MimeType类型
- Flex4.5中datagrid加入图片image显示
- 成语接龙(Idiomatic Phrases Game)
- POJ 3414 Pots 广度优先搜索+记忆化
- hibernate缓存:一级缓存和二级缓存
- Lua总结二