jQuery Smartify
jQuery Smartify boosts web application load times and lazy loads images, calls Ajax, plays with css classes in/on demand, while element is/or being visible in device viewport.
It has full capability of jQuery Lazyload, but with more elements coverage and advanced. This doesn't only work for <img>, have capabality to smartify any elements!
Plugin is inspired by jQuery Lazyload created by Mika Tuupola.
Features, Benefits & Plans
- Boost your web application load time.
- Multiple Elements Support
- Dynamically load contents via Ajax call. e.g: Load each section on just before becoming visible.
- Infinite load items, such as products to sale. Best for e-commerce websites.
- Load images when visible in viewport.
- Load dynamic images for different DPI supports. Such as 3x for High Res(Retina) display.
- Toggle, Add or Remove element classes.
- Or just call User defined callback function.
- HTML5 History API (wip)
Getting Started
Preferred method:
- Install with Bower:
$ bower install smartify
Other methods:
- Download zipball of latest release.
- Download the latest production or development files individually:
Note: jquery.smartify.js have a dependency on jQuery
Quick Start
<!-- Elements to Smartify --> <img class="smartify" sm-src="/static/path/to/img.png"> ... <!-- JavaScript before </body> --> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> <script src="dist/jquery.smartify.min.js"></script> <script> jQuery(function($) { $('.smartify').smartify(); // "smartify" }); </script>Examples
For some working examples of Smartify, visit the examples page.
Documentation
Browser Support
Manually Tested Platforms on Linux and Mac OS X only ()
- Chrome (Linux/Mac OS X/Android 5.1+)
- Firefox 40+ (Linux/Mac OS X/Android 5.1+)
- Safari 5+ (Mac OS X)
- Opera 11+ (Linux/Mac OS X/Android 5.1+)
Issues
Discovered a bug? Please create an issue here on GitHub!
https://github.com/vinaykrsharma/jquery.smartify/issues
Versioning
For transparency and insight into our release cycle, releases will be numbered with the following format:
<major>.<minor>.<patch>
And constructed with the following guidelines:
- Breaking backwards compatibility bumps the major
- New additions without breaking backwards compatibility bumps the minor
- Bug fixes and misc changes bump the patch
For more information on semantic versioning, please visit http://semver.org/.
