项目作者: ryanve

项目描述 :
Cross-browser JavaScript dimensions module
高级语言: JavaScript
项目地址: git://github.com/ryanve/dime.git
创建时间: 2012-03-04T10:38:22Z
项目社区:https://github.com/ryanve/dime

开源协议:

下载


dime

cross-browser JavaScript module to measure dimensions

  1. $ npm install dime

API (3.0)

Static methods

Fast simple top-level methods

  1. dime.width(object) // get width
  2. dime.height(object) // get height
  3. dime.width(element, px) // set width
  4. dime.height(element, px) // set height

Measurable objects

  • window
  • DOM node: document or element
  • object with .width/.height properties or methods
  1. dime.width(screen) // => screen.width
  2. dime.width({width:10, height:10}) // => 10

Chain methods

jQueryish methods for compatible libs (such as ender)

  1. .width() // get the width of the 1st elem in the set
  2. .width(value) // set the width of all elems in the set
  3. .height() // get the width of the 1st elem in the set
  4. .height(value) // set the width of all elems in the set

Integrated usage

  1. $(window).width()
  2. $(document).width()
  3. $(element).width()
  4. $(element).width(100)

Standalone usage

  1. dime.fn.width.call(stack)
  2. dime.fn.width.call(stack, px)

Standalone examples

It is only sensible to use these for setting dimensions—the statics are faster for gets.

  1. dime.fn.width.call([document]) // same as dime.width(document)
  2. dime.fn.width.call(document.querySelectorAll('.example'), 100)

Version notes

3.x is leaner than previous releases

  • 2.x device methods were removed because the native screen provides these.
  • 2.x viewport methods were removed in favor of dime.width(window) although those methods
    are available in verge.
  • In 3.x dime is a plain object—not a wrapper function.
  • verge: viewport utilities

Resources

License: MIT

Copyright (C) 2012 by Ryan Van Etten