加载中…
个人资料
孔宪涛
孔宪涛
  • 博客等级:
  • 博客积分:0
  • 博客访问:5,271
  • 关注人气:0
  • 获赠金笔:0支
  • 赠出金笔:0支
  • 荣誉徽章:
相关博文
推荐博文
正文 字体大小:

Jquery.dimensions.js插件-----Dimensions API

(2010-01-28 11:08:02)
标签:

jquery

plugins

dimensions

api

杂谈

分类: jplugins
方法:

      * height
      * innerHeight
      * innerWidth
      * offset
      * offsetParent
      * outerHeight
      * outerWidth
      * position
      * scrollLeft
      * scrollTop
      * width

height

      这是对jq核心height方法的扩展,使它既能获取元素的高度,也能获取窗体(windows)和文档(document object)的高度.当用在元素上时,通过指定一个数值来设定它的高度.同时它对显示和隐藏的元素都起作用.

     返回值:      像素值


     参数:        数值


      一个整数代表想要设定的高度.如果只是一个数字,方法会为你自动加上'px'.

     可链性(Chainable,jQuery中提到了Chainable Methods的思想,也就是调用jQuery中的方法会返回一个jQuery对象,仍然可以继续调用其中的方法,这样,就形成了一个“链条”,通过“.”一个一个调用下去_)

     此方法可链,只要传递一个数值.

例子::

      $(window).height();

      $(document).height();

      $("#myElement").height();

      $("#myElement").height(100);

innerHeight

      获取第一个匹配元素的内高 (不包含border但包含padding) 对显示和隐藏的元素都起作用.
    
返回:


      像素值

可链性(Chainable
)

     不可链


例子:

      $("#myElement").innerHeight();

innerWidth

      获取第一个匹配元素的内宽 (不包含border但包含padding) 对显示和隐藏的元素都起作用.


返回:


     像素值


可链性(Chainable
)

     不可链

例子:

      $("#myElement").innerHeight();

offset

      获取一个元素相对于当前点(viewport)的位置. 为确保精确计算,对于margin,border,padding要使用像素单位,此方法对对显示和隐藏的元素都起作用.

返回:
      一个含有top和left属性的对象An object with top and left properties that are numbers that represent the offset in pixels. 当scroll选项为true时,另外两个属性scrollTop和scrollLeft也包含在其中。

参数:
      选项:设置起来配置offset的计算方式。

       margin (布尔值)
            元素的margin是否计算在内。缺省为计算(true)

       border (布尔值)
              元素的border是否计算在内。缺省为不计算(false)

       padding (布尔值)
              元素的padding是否计算在内。缺省为不计算(false)

       scroll (布尔值)
             父元素的scroll offsets 是否计算在内。缺省为计算(true)

       lite (布尔值)

            当为真(true)时,将忽略浏览器的正常值,就像处理当前元素的border和margin一样.这很好的提升了性能,但要牺牲一些精确性.缺省为false.

       ativeTo (HTML元素)

             这应该是元素的一个包含位置设置(比如absolute或relative)的父元素,方法将相对与这个父元素来调整offset.缺省情况是body元素.


      returnObject
         一个存储返回值的对象.目的是不破坏链条.如果在链条中传递,将不回破坏链条而且结果将被赋予这个对象.

可链性:
   

    可链,当一个对象做为地二个参数传递的时候.

例子:

      $("#myElement").offset();

结果:

     { top: 100, left: 100, scrollTop: 10, scrollLeft: 10 }

例子:
      $("#myElement").offset({ scroll: false });

结果:


      { top: 100, left: 100 }

例子:
     
      var offset = {};
      $("#myElement").offset({ scroll: false }, offset);
                        

结果:

      offset == { top: 100, left: 100 }

offsetParent

      返回第一个匹配元素的有定位的父元素的集合.这是元素的第一有定位的父元素这个方法只对可见元素起作用.

返回:

     jQuery 集合


可链性: 可链


例子:

      $("#myElement").offsetParent();

outerHeight

      获取第一个匹配元素的offsetHeight (缺省包含border和padding) 这个方法对显示和隐藏的元素都起作用.通过传递map选项的margin为真,可以将margin计算在内.margin可选是在1.1版本中加入的.

返回::像素值

参数::

     选项:
          用来设定outerheights的计算方式。

          margin (布尔值)
             是否元素的margin计算在内。缺省不计算

可链性:不可链


例子:

      $("#myElement").outerHeight();

例子:
      $("#myElement").outerHeight({ margin: true });

outerWidth

      获取第一个匹配元素的offsetWidth (缺声情况是包含border和padding)此方法对显示和隐藏元素都起作用。. 通过传递map选项的margin为真,可以将margin计算在内.margin可选是在1.1版本中加入的.

返回::像素值

参数::

     选项:
          用来设定outerheights的计算方式。

          margin (布尔值)
             是否元素的margin计算在内。缺省不计算

可链性:不可链

例子:

      $("#myElement").outerWidth();

例子:

      $("#myElement").outerWidth({ margin: true });

position

      获取一个元素相对于它的offset父元素的上和左的位置。为确保计算精确,对于margin要使用像素单位。此方法只作用于可见元素。

返回:
   

一个包含top,left属性的对象,top,left的数字代表哦offset的像素值。

可链性:
      可链,当一个对象作为第二个参数传递。

例子:

      $("#myElement").position();

结果:

      { top: 10, left: 10 }

例子:
     
      var position = {};
      $("#myElement").position(position);
                        
结果:

      position == { top: 10, left: 10 }

scrollLeft

      起到获取和设置双重作用。但没有数值作为参数时,它获取第一个匹配元素的scroll left offset,当有一个数值作为参数时, 所有匹配元素scroll left offset都被设置为这个参数值。方法对可见元素和隐藏元素都起作用。

返回:像素值。

参数:数值

          一个整数,表示想要设置的scroll left offset值。

可链性:      可链,当一个只作为参数时。

例子:

      $("#myElement").scrollLeft(100);

例子:

      $("#myElement").scrollLeft();

结果:

      100

scrollTop

      起到获取和设置双重作用. 但没有数值作为参数时,它获取第一个匹配元素的scroll top offset .当有一个数值作为参数时, 所有匹配元素scroll top offset都被设置为这个参数值。. 对显示和隐藏的元素都起作用.

返回:像素值:

     
参数:

        数值

          一个整数代表想要设置的 scroll top offset.

      Chainable:
      可以,当一个参数传递的时候

例子:

      $("#myElement").scrollTop(100);

例子:

      $("#myElement").scrollTop();

结果:

      100

width

        这是对jq核心width方法的扩展,使它既能获取元素的宽度,也能获取窗体(windows)和文档(document object)的宽度.当用在元素上时,通过指定一个数值来设定它的宽度.同时它对显示和隐藏的元素都起作用.


返回值:      像素值
参数:        数值


      一个整数代表想要设定的高度.如果只是一个数字,方法会为你自动加上'px'.

     Chainable:

      当然,只要传递一个数值.

例子:

      $(window).width();

      $(document).width();

      $("#myElement").width();

      $("#myElement").width(100);

0

阅读 评论 收藏 转载 喜欢 打印举报/Report
前一篇:30个忠告
  • 评论加载中,请稍候...
发评论

    发评论

    以上网友发言只代表其个人观点,不代表新浪网的观点或立场。

    < 前一篇30个忠告
      

    新浪BLOG意见反馈留言板 电话:4000520066 提示音后按1键(按当地市话标准计费) 欢迎批评指正

    新浪简介 | About Sina | 广告服务 | 联系我们 | 招聘信息 | 网站律师 | SINA English | 会员注册 | 产品答疑

    新浪公司 版权所有