jQuery.imgUtil

image utilities collection.

Components

$.imgUtil.calcNaturalWH

$.imgUtil.calcNaturalWH caliculates img's natural width / height.
Newer browsers have naturalWidth/naturalHeight feature. With these, we can get the img's original width/height. But these features are sometimes difficult to handle because it fails and returns zero before the img was not load-completed.
$.imgUtil.calcNaturalWH preloads img as background task then returns the values you want.
This also works on old browsers which do not have naturalWidth/naturalHeight feature using tricky way.

$.fn.imgCoverRect / $.fn.refreshImgCoverRect

$.fn.imgCoverRect adjusts img style to cover the container.

$.fn.imgCoverRect / $.fn.imgContainRect / $.fn.imgFitToEdge

$.fn.imgContainRect adjusts img style to be contained by the container.

Demos

• $.imgUtil.calcNaturalWH
• $.fn.imgCoverRect
• $.fn.imgCoverRect - oninit/overrideImgPut
• $.fn.refreshImgCoverRect
• $.fn.imgContainRect
• $.fn.imgContainRect - oninit/overrideImgPut
• $.fn.refreshImgContainRect
• $.fn.imgFitToEdge
• $.fn.imgFitToEdge - oninit/overrideImgPut
• $.fn.refreshImgFitToEdge

Usage

see demos

Depends

• jQuery 1.9.1 (>=1.7.0)

Browsers

IE6+ and other new browsers.

License

Copyright (c) 2013 "Takazudo" Takeshi Takatsudo
Licensed under the MIT license.

Build

Use

• CoffeeScript
• grunt

then,

npm install

And, to build

grunt

to watch

grunt watch