jQuery 尺寸
通过 jQuery,很容易处理元素和浏览器窗口的尺寸。
jQuery 尺寸 方法
jQuery 提供多个处理尺寸的重要方法:
- width()
- height()
- innerWidth()
- innerHeight()
- outerWidth()
- outerHeight()
jQuery 尺寸
jQuery width() 和 height() 方法
width() 方法设置或返回元素的宽度(不包括内边距、边框或外边距)。
height() 方法设置或返回元素的高度(不包括内边距、边框或外边距)。
下面的例子返回指定的 <div> 元素的宽度和高度:
实例
var txt="";
txt+="Width: " + $("#div1").width() + "</br>";
txt+="Height: " + $("#div1").height();
$("#div1").html(txt);
});
jQuery innerWidth() 和 innerHeight() 方法
innerWidth() 方法返回元素的宽度(包括内边距)。
innerHeight() 方法返回元素的高度(包括内边距)。
下面的例子返回指定的 <div> 元素的 inner-width/height:
实例
var txt="";
txt+="Inner width: " + $("#div1").innerWidth() + "</br>";
txt+="Inner height: " + $("#div1").innerHeight();
$("#div1").html(txt);
});
jQuery outerWidth() 和 outerHeight() 方法
outerWidth() 方法返回元素的宽度(包括内边距和边框)。
outerHeight() 方法返回元素的高度(包括内边距和边框)。
下面的例子返回指定的 <div> 元素的 outer-width/height:
实例
var txt="";
txt+="Outer width: " + $("#div1").outerWidth() + "</br>";
txt+="Outer height: " + $("#div1").outerHeight();
$("#div1").html(txt);
});
jQuery 尺寸的更多相关文章
- 实现文字自动横移--- jquery尺寸相关函数
效果图: 一实现文字自动横移 <style type="text/css"> #demo {overflow:scroll;width:740px; } #indemo ...
- jQuery 基础(4)jQuery 尺寸
jQuery 尺寸方法jQuery 提供多个处理尺寸的重要方法:width()height()innerWidth()innerHeight()outerWidth()outerHeight()jQu ...
- 关于jquery尺寸的总结
以前总是对jquery的尺寸稀里糊涂,有需要的可以看下下面的代码: ①页面布局如下: <!doctype html> <html> <head> <meta ...
- jquery尺寸和jQuery设置和获取内容方法
一.jquery尺寸 jQuery 提供多个处理尺寸的重要方法: width() 设置或返回元素的宽度(不包括内边距.边框或外边距),括号中可填数值宽度参数,无单位 height() 设置或 ...
- jQuery尺寸
jQuery 尺寸 jQuery width() 和 height() 方法 width() 方法设置或返回元素的宽度(不包括内边距.边框或外边距). height() 方法设置或返回元素的高度(不包 ...
- jQuery尺寸算法
我们默认都统一是采用offsetWidth或者offsetHeight取值了,但我们知道关于这2个尺寸的算法是这样的: offsetWidth = border-left-width + paddin ...
- 图解JQUERY尺寸及位置定义
最近在学习JQUERY的一些应用,接触到了JQUERY对于元素尺寸及位置定义,还有就是配合浏览器尺 寸及状态的计算所做出的一些动画特效.其实像这类JQUERY应用无外乎涉及这些属性的调用:innerH ...
- jQuery 尺寸 方法
jQuery 提供多个处理尺寸的重要方法: width() height() innerWidth() innerHeight() outerWidth() outerHeight()
- jquery——尺寸
1. 获取和设置元素的尺寸 2. 获取元素相对页面的绝对位置:offset() 这种方式增加的盒子不会对之前的结构产生影响 demo: <!DOCTYPE html> <html l ...
随机推荐
- sql递归函数(自定义函数递归查找) 能返回递归的层次
实现效果图如下: 创建表: create table t_tree ( id int IDENTITY(1,1), parentid int, name varchar(10) ) go 插入测试数据 ...
- visual studio 资源视图 空白 解决方案
visual studio 资源视图打开后显示空白的解决方案步骤: 在解决方案view下,右键点击工程 1 unload projects 完成第一步后仍然在解决方案view下,右键点击工程 2 re ...
- HDOJ/HDU 1180 诡异的楼梯(经典BFS-详解)
Problem Description Hogwarts正式开学以后,Harry发现在Hogwarts里,某些楼梯并不是静止不动的,相反,他们每隔一分钟就变动一次方向. 比如下面的例子里,一开始楼梯在 ...
- 如何解决PHP生成UTF-8编码的CSV文件用Excel打开乱码的问题
为了识别 Unicode 文件,Microsoft 建议所有的 Unicode 文件应该以 ZERO WIDTH NOBREAK SPACE字符开头.这作为一个”特征符”或”字节顺序标记(byte-o ...
- hdoj 3836 Equivalent Sets【scc&&缩点】【求最少加多少条边使图强连通】
Equivalent Sets Time Limit: 12000/4000 MS (Java/Others) Memory Limit: 104857/104857 K (Java/Other ...
- hdoj 1200 To and Fro
To and Fro Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total ...
- Unity3D跨平台时partial分部方法的使用
最近看到项目中插件的一部分逻辑,发现问题多多,可读性很差,并且容易出错,于是随手整理了下逻 辑.Unity3D的插件逻辑,因为要考虑到针对各平台的移植,因此会大片的出现#if/#endif等条件编译, ...
- 移动測试技术保护源码!解码全球首款移动端白盒測试工具ThreadingTest (文章转自己主动点科技)
作者 智晓锋 - 2014/07/14 自从斯诺登曝光美监听丑闻事件之后,我国政府就将信息安全问题上升到了国家安全的高度.基于此.国内的一家创业公司推出了智能型Android真机白盒測试以及开发辅助类 ...
- 深入理解Fsync----JBD内核调试 专业打杂程序员 @github yy哥
http://hustcat.github.io/ http://www.cnblogs.com/hustcat/p/3283955.html http://blog.sina.com.cn/s/ar ...
- unix进程的环境--unix环境高级编程读书笔记
http://blog.csdn.net/xiaocainiaoshangxiao/article/category/1800937