阿西河

所有教程

公众号
🌙
阿西河前端的公众号

我的收藏

    最近访问  (文章)

      教程列表

      抓包专区
      测试专区

      插件 jQuery.actual 中文API文档

      插件 jQuery.actual 中文API文档 https://github.com/dreamerslab/jquery.actual

      jQuery Actual Plugin

      Get the actual width/height of invisible DOM elements with jQuery.

      Description

      jQuery has trouble finding the width/height of invisible DOM elements. With element or its parent element has css property ‘display’ set to ‘none’. $('.hidden').width(); will return 0 instead of the actual width; This plugin simply fix it.

      Demo

      • Normal usage see demo/normal.html
      • If you use css3pie you might also want to take a look at another demo( demo/css3pie.html )
      • Live demo please take a look at this and this

      Documentation

      • There is a syntax highlight version, please see this post
      • For chinese version please go here

      Requires

      • jQuery >= 1.2.3

      Browser Compatibility

      Installation

      • First, make sure you are using valid DOCTYPE
      • Include necessary JS files
      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
      <script type="text/javascript" src="path-to-file/jquery.actual.js"></script>
      

      Usage

      Example code:

      // get hidden element actual width
      $( '.hidden' ).actual( 'width' );
      
      // get hidden element actual innerWidth
      $( '.hidden' ).actual( 'innerWidth' );
      
      // get hidden element actual outerWidth
      $( '.hidden' ).actual( 'outerWidth' );
      
      // get hidden element actual outerWidth and set the `includeMargin` argument
      $( '.hidden' ).actual( 'outerWidth', { includeMargin : true });
      
      // get hidden element actual height
      $( '.hidden' ).actual( 'height' );
      
      // get hidden element actual innerHeight
      $( '.hidden' ).actual( 'innerHeight' );
      
      // get hidden element actual outerHeight
      $( '.hidden' ).actual( 'outerHeight' );
      
      // get hidden element actual outerHeight and set the `includeMargin` argument
      $( '.hidden' ).actual( 'outerHeight', { includeMargin : true });
      
      // if the page jumps or blinks, pass a attribute '{ absolute : true }'
      // be very careful, you might get a wrong result depends on how you makrup your html and css
      $( '.hidden' ).actual( 'height', { absolute : true });
      
      // if you use css3pie with a float element
      // for example a rounded corner navigation menu you can also try to pass a attribute '{ clone : true }'
      // please see demo/css3pie in action
      $( '.hidden' ).actual( 'width', { clone : true });
      
      // if it is not a block element. By default { display: 'block' }.
      // for example a inline element
      $( '.hidden' ).actual( 'width', { display: 'inline-block' });
      

      Credits

      License

      The expandable plugin is licensed under the MIT License (LICENSE.txt).

      Copyright (c) 2012 Ben Lin

      目录
      目录