1.jquery关于页面元素的位置和文档偏移距离提供了position和offset方法。
2.页面头部和底部的切换
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="http://geeboy.3vfree.net/app/2048game/jquery-2.1.1.min.js"></script> <script type="text/javascript" > $(document).ready(function(){ //$("button[name='top']").css("margin-top",$("body").height()-$(this).height()); console.log($("input:button[name='top']").attr("name")); $("input:button[name='top']").offset({left:0,top:$("body").height()}); $("input:button[name='bottom']").offset({left:0,top:0}); $("input").click(function(){ var name=$(this).attr("name"); if(name=="top"){ //alert("top"); //var body_scroll_height=$("body").attr("scrollHeight"); //alert(body_scroll_height); //alert($("#contentDiv").scrollTop()); $("body").scrollTop(0); //alert(); //$("#contentDiv").attr("scrollBottom",0); //$('#cke_77_label').live('click', function() { //javascript:document.getElementsByTagName('BODY')[0].scrollTop=document.getElementsByTagName('BODY')[0].scrollHeight; //}); }else if(name=="bottom"){ //alert("bottom"); //$("body").scrollTop(0); $("body").scrollTop($("body").height()); } }); }); </script> </head> <body style="height:2000px"> <input type="button" value="向上滑动" name="top" /> <input type="button" value="向下滑动" name="bottom" /> <div style="width:400;height:400px;margin:40 auto;border:solid black 1px" id="contentDiv"> <h1>滚动条上下滑动</h1> </div> </body> </html>
相关推荐
理解Jquery 的offset与position方法
先看看这两个方法的定义。 offset(): 获取匹配元素在当前视口的相对... 先来看看在jquery框架源码里面,是怎么获得position()的: 代码如下: // Get *real* offsetParent var offsetParent = this.offsetParent(), /
本文实例分析了Jquery中offset()和position()的区别。分享给大家供大家参考。具体分析如下: 一、Jquery中offset() 获取匹配元素在当前视口的相对偏移。 总是计算相对于文档的位置,无论元素的父元素或祖先元素的...
1、position方法 jquery api地址:http://jquery.cuishifeng.cn/position.html position方法获取匹配元素相对父元素的偏移。 2、说明 2.1 与offset()区别 .offset()是获得该元素相对于documet的当前坐标 .position()...
主要介绍了jQuery.position()方法获取不到值的安全替换方法,本文给出了一种变通的方法,用.offset()来换算,需要的朋友可以参考下
offset()方法:使用offset()方法可以获取元素的位置,返回的是一个对象,包含left和top属性,表示相对于文档的偏移坐标,和父级元素没有关系。;案例演示:;案例实现:;案例实现:获取元素的位置;position()方法:...
获取页面某一元素的绝对X,Y坐标,可以用offset()方法:(body属性设置margin :0;padding:0;) var X = $('#DivID').offset().top; var Y = $('#DivID').offset().left; 获取相对(父元素)位置: var X = $('#DivID')....
使用jQuery获取元素位置时,我们会使用position()或offset()方法,两个方法都返回一个包含两个属性的对象-左边距和上边距,它们两个的不同点在于位置的相对点不同。 position()获取相对于它最近的具有相对位置...
position()函数用于返回当前匹配...与offset()不同的是:position()返回的是相对于被定位的祖辈元素的坐标,offset()返回的是相对于当前文档的坐标。此外,position()函数无法用于设置操作。如果当前元素的祖辈元素全部
JQuery UI/API/1.7 中文帮助文档 ...ui.position - 辅助对象相对于上级元素的当前位置, 使用{ top, left } ui.offset - 辅助对象相对于页面的当前绝对位置, 使用{ top, left } 其他附加文件 UI Core 示例
11.2 数组和对象操作 183 11.2.1 jQuery.each(object, [callback]) 183 11.2.2 jQuery.extend([deep], target, object1, [objectN]) 183 11.2.3 jQuery.grep(array, callback, [invert]) 185 11.2.4 jQuery.make...
position() scrollTop( [val] ) scrollLeft( [val] ) 尺寸 height( [val] ) width( [val] ) innerHeight() innerWidth() outerHeight(options) outerWidth(options) 选择器 基本 #id element .class * ...
在使用jquery的过程中,想取得当前点击input的绝对位置而去显示一个div,jquery本身提供offset和position这个两个方法,但position官方解释是relative to the offset parent,可以看到是针对父结点的,而offset官方...
jQuery 使用名为 noConflict() 的方法来解决该问题。 var jq=jQuery.noConflict(),帮助您使用自己的名称(比如 jq)来代替 $ 符号。 亲自试一试 结论 由于 jQuery 是为处理 HTML 事件而特别设计的,那么当您遵循...
offset([coordinates]) position() scrollTop([val]) scrollLeft([val]) 尺寸 heigh([val|fn]) width([val|fn]) innerHeight() innerWidth() outerHeight([soptions]) outerWidth([options]) 选择器 ...
IE用户无法在线查看本文档,请下载jQuery API Version1.5 中文版AIR客户端查看,或者使用chrome,safari,firefox,opera等浏览器查看!!! jQuery 1.5 API Cheat Sheet来源 Selectors Basics #id element .class, ...
主要介绍了jQuery获取页面元素绝对与相对位置的方法,涉及jQuery中offset、position等方法的使用技巧,需要的朋友可以参考下