jQuery中尺寸与坐标函数
来源:互联网 发布:数控编程图纸大全 编辑:程序博客网 时间:2024/04/30 00:45
一、获得坐标
1.offset()
offset() 方法返回或设置匹配元素相对于文档的偏移(位置)。(即视口坐标)
该方法返回的对象包含两个整型属性:top 和 left,以像素计。
此方法只对可见元素有效。
代码:
alert("内框坐标为:("+$(".samll").offset().left+","+$(".samll").offset().top+")");
结果:
2.position()
position() 方法返回匹配元素相对于父元素的位置(偏移)。(相对于父元素的文档坐标)
该方法返回的对象包含两个整型属性:top 和 left,以像素计。
此方法只对可见元素有效。
代码:
$(function(){
var p=$(".big").position();
alert("外框坐标为:("+p.left+","+p.top+")");
});
结果:
3.offsetParent()
offsetParent() 方法返回最近的祖先定位元素。
定位元素指的是元素的 CSS position 属性被设置为 relative、absolute 或 fixed 的元素。
可以通过 jQuery 设置 position,或者通过 CSS 的 position 属性。
二、获得尺寸
1.width() 和 height() 方法
width() 方法设置或返回元素的宽度(不包括内边距、边框或外边距)。
height() 方法设置或返回元素的高度(不包括内边距、边框或外边距)。
代码:
$(function(){
var w=$(".big").width();
var h=$(".big").height();
alert("宽度:"+w+",高度:"+h);
});
结果:
2.innerWidth() 和 innerHeight() 方法
innerWidth() 方法返回元素的宽度(包括内边距)。
innerHeight() 方法返回元素的高度(包括内边距)。
代码:
alert("内框内部尺寸为:("+$(".samll").innerWidth()+","+$(".samll").innerHeight()+")");
结果:
3.outerWidth() 和 outerHeight() 方法
outerWidth() 方法返回元素的宽度(包括内边距和边框)。
outerHeight() 方法返回元素的高度(包括内边距和边框)。
代码:
alert("内框外部尺寸为:("+$(".samll").outerWidth()+","+$(".samll").outerHeight()+")");
结果:
outerWidth(true) 方法返回元素的宽度(包括内边距、边框和外边距)。
outerHeight(true) 方法返回元素的高度(包括内边距、边框和外边距)。
代码:
alert("内框尺寸为:("+$(".samll").outerWidth(true)+","+$(".samll").outerHeight(true)+")");
结果:
- jQuery中尺寸与坐标函数
- jquery中获得元素尺寸和坐标的方法
- JavaScript 坐标与尺寸
- html中元素尺寸、坐标的获取
- [原创] jQuery源码分析-17坐标和尺寸 Offset & Dimensions
- 手机屏幕尺寸与iOS开发坐标的关系
- 浏览器中元素尺寸和坐标的名词解释
- Android中view的各种尺寸,宽高、XY坐标
- 坐标尺寸 大锅烩
- JavaScript 尺寸及坐标
- unity中世界坐标与局部坐标
- js,jquery中获得窗口尺寸
- jquery-尺寸
- jQuery - 尺寸
- jQuery - 尺寸
- jquery-尺寸
- jQuery 尺寸
- jQuery - 尺寸
- 总结linux清理垃圾命令
- leetcode #51
- 分页方法
- leetcode Longest Valid Parentheses
- Android 最佳性能实践之内存管理(一)
- jQuery中尺寸与坐标函数
- 设计模式之观察者
- MySQL的备份与数据恢复
- Android 基础总结:(六)Service详解(下)
- 数据结构—二叉树遍历—非递归算法
- 浅析 RunLoop
- c++高效
- Maximum Subarray
- HTML图片懒加载