javascript 获取页面的高度及滚动条的位置的代码
var Viewport={
top : function(){
return window.pageYOffset
|| document.documentElement && document.documentElement.scrollTop
|| document.body.scrollTop;
},
height : function(){
return window.innerHeight
|| document.documentElement && document.documentElement.clientHeight
|| document.body.clientHeight;
},
left : function(){
return window.pageXOffset
|| document.documentElement && document.documentElement.scrollLeft
|| document.body.scrollLeft;
},
width : function(){
return window.innerWidth
|| document.documentElement && document.documentElement.clientWidth
|| document.body.clientWidth;
},
right : function(){
return Viewport.left() + Viewport.width();
},
bottom : function(){
return Viewport.top() + Viewport.height();
}
};
style.position="absolute";
style.left=50%;
style.top=Viewport.Top()+Viewport.Height()/2+"px";
相关推荐
-
JS和jquery获取各种屏幕的宽度和高度的代码
Javascript: 网页可见区域宽: document.body.clientWidth 网页可见区域高: document.body.clientHeight 网页可见区域宽: document.body.offsetWidth (包括边线的宽) 网页可见区域高: document.body.offsetHeight (包括边线的高) 网页正文全文宽: document.body.scrollWidth 网页正文全文高: document.body.scrollHeight 网页被卷去的高
-
js控制元素显示在屏幕固定位置及监听屏幕高度变化的方法
本文实例讲述了js控制元素显示在屏幕固定位置及监听屏幕高度变化的方法.分享给大家供大家参考.具体如下: //控制logo的显示位置 Begin window.addEventListener("resize", function () { // 得到屏幕尺寸 (内部/外部宽度,内部/外部高度) changeLogoPosition(); }, false); changeLogoPosition(); function changeLogoPosition() { var conten
-
javascript窗口宽高,鼠标位置,滚动高度(详细解析)
网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:document.body.offsetWidth (包括边线的宽) 网页可见区域高:document.body.offsetHeight (包括边线的宽) 网页正文全文宽:document.body.scrollWidth 网页正文全文高:document.body.scrollHeight 网页被卷去的高:document.body.scr
-
js 获取浏览器高度和宽度值(多浏览器)
IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.documentElement.clientWidth ==> 可见区域宽度 document.documentElement.clientHeight ==> 可见区域高度 FireFox中: document.body.clientWidth ==> BODY对象宽度 document.
-
js获取div高度的代码
<style type="text/css"> <!-- #top { color: #FFFFFF; background-color: #FF0000; text-align: left; text-indent: 24px; width: 780px; line-height: 24px; font-size: 12px; padding-right: 10px; padding-left:
-
js获取网页高度(详细整理)
网页可见区域宽: document.body.clientWidth 网页可见区域高: document.body.clientHeight 网页可见区域宽: document.body.offsetWidth (包括边线的宽) 网页可见区域高: document.body.offsetHeight (包括边线的高) 网页正文全文宽: document.body.scrollWidth 网页正文全文高: document.body.scrollHeight 网页被卷去的高: document.b
-
获取JS中网页各种高宽与位置的方法总结
screen对象 获取屏幕的高宽(分辨率) screen.width //屏幕的宽 screen.height //屏幕的高 screen.availWidth //屏幕可用宽度 屏幕的像素高度减去系统部件高度之后的值 screen.availHeight //屏幕可用高度 屏幕的像素宽度减去系统部件宽度之后的值 window对象 获得窗口位置及大小 window.screenTop //窗口顶部距屏幕顶部的距离 window.screenLeft //窗口左侧距屏幕左侧的距离 window.i
-
js和jquery如何获取图片真实的宽度和高度
1.什么时候需要获取图片真实的宽度和高度 在做pc网页的时候,有时候会考虑按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式! 另外一种就是在手机页面上,在新闻页插入的图片往往都是按照图片的原尺寸来展示,如果手机屏幕太小,太大的图就会超出去!这时候有两种解决办法 1)给所有的图片加上这样的样式 1 复制代码 代码如下: .news img{margin:5px auto; display:block;width:100%; height:auto;} 但是这种方式有另外
-
javascript 获取页面的高度及滚动条的位置的代码
复制代码 代码如下: var Viewport={ top : function(){ return window.pageYOffset || document.documentElement && document.documentElement.scrollTop || document.body.scrollTop; }, height : function(){ return window.innerHeight || document.documentElement &
-
页面刷新时记住滚动条的位置jquery代码
@*点击按钮页面刷新的时候 记住滚动条的位置*@ 复制代码 代码如下: <script type="text/javascript"> window.onbeforeunload = function () { var scrollPos; if (typeof window.pageYOffset != 'undefined') { scrollPos = window.pageYOffset; } else if (typeof document.compatMode
-
用JavaScript获取页面文档内容的实现代码
JavaScript的document对象包含了页面的实际内容,所以利用document对象可以获取页面内容,例如页面标题.各个表单值. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>js基础</title> </head> <body> <p>一. 用Documen
-
JavaScript获取页面中第一个锚定文本的方法
本文实例讲述了JavaScript获取页面中第一个锚定文本的方法.分享给大家供大家参考.具体如下: 下面的JS代码通过document.archors数组获取第一个archor的innerHTML <!DOCTYPE html> <html> <body> <a name="html">jb51.net</a><br> <a name="css">CSS Tutorial</a
-
JavaScript获取页面上某个元素的代码
W3C标准推荐的语法是通过document文档对象获取DOM树内的内的某个元素,常见的方法有getElementById().getElementsByName().getElementsByTagName(),他们的作用分别通过id属性.name属性/标签名称返回单个节点或节点集合. 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/
-
JavaScript获取页面中超链接数量的方法
本文实例讲述了JavaScript获取页面中超链接数量的方法.分享给大家供大家参考,具体如下: 这里演示JavaScript取得页面的超链接数,感兴趣的朋友可以学习借鉴一下. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-total-link-num-codes/ 具体代码如下: <html> <head> <title>JavaScript取得页面的超链接数</title> <script l
-
JavaScript获取页面上被选中文字的方法技巧
这里介绍的一个小技巧是如何用JavaScript获取页面上被选中的文字的方法.最关键的JavaScript API是: 复制代码 代码如下: event.selection = window.getSelection(); 这里的selection实际上是个对象,但如果我们使用 .toString()或强行转化成字符串,我们将得到被选中的文字. 复制代码 代码如下: $(document).ready(function () { $(".contenttext").mouseup
-
JavaScript获取页面中表单(form)数量的方法
本文实例讲述了JavaScript获取页面中表单(form)数量的方法.分享给大家供大家参考.具体如下: 下面的JS代码通过document.forms数组获得网页中表单(form)的数量 <!DOCTYPE html> <html> <body> <h1>sharejs.com</h1> <form name="Form1"></form> <form name="Form2"
-
JavaScript获取页面元素的常用方法详解
1.通过标签获取元素,返回一个数组 var li = document.getElementsByTagName('li');//标签获取元素 li[0].innerHTML;// 查看获取元素的内容 li[0].innerHTML = "content";//修改获取到标签中的内容 2.通过id获取页面元素 var header = document.getElementById("header");//id获取元素 3.通过class名字获取页面元素 var l
-
Javascript获取页面元素的绝对位置实现
目录 一.概念 二.获取方法 三.代码 四.问题 一.概念 绝对位置:网页元素的左上角相对于整张网页左上角的坐标 相对位置:相对于浏览器窗口左上角的坐标 二.获取方法 1.每个元素都有offsetTop和offsetLeft属性,表示该元素的左上角与父容器(offsetParent对象)左上角的距离. 2.每个元素都有offsetParent属性.offsetParent属性返回一个对象的引用,这个对象是距离调用offsetParent的元素最近的(在包含层次中最靠近的),并且是已进行过CSS定
随机推荐
- 15个常用的javaScript正则表达式(收藏)
- 详解cookie验证的php应用的一种SSO解决办法
- mongodb错误tcmalloc: large alloc out of memory, printing stack and exiting解决办法
- iOS自定义键盘切换效果
- 探索ORACLE之ASM概念(完整版)
- 详解免费开源的.NET多类型文件解压缩组件SharpZipLib(.NET组件介绍之七)
- php Ubb代码编辑器函数代码
- php HtmlReplace输入过滤安全函数
- Android中微信抢红包插件原理解析及开发思路
- MySQL查询优化之explain的深入解析
- python简单判断序列是否为空的方法
- Javascript函数式编程语言
- iptables配置(/etc/sysconfig/iptables)操作方法
- 子窗口、父窗口和Silverlight之间的相互调用
- JS实现支持Ajax验证的表单插件
- 设置和读取cookie的javascript代码
- 支持半透明窗口,Mozilla再度更新
- android实现文件下载功能
- PyTorch搭建一维线性回归模型(二)
- shell脚本字符串和数组的使用操作方法