Navigation
HomeSearch
Submit A Resource
Contact Us
About Functionn
Subscription Options
Subscribe By Email (265+)
Lists
Archives
Apr 18, 2012
Riloadr - A Cross-Browser Framework-Independent Responsive Images Loader
Riloadr is a cross-browser framework-independent responsive images loader. The goal of this library is to deliver optimized, contextual image sizes in responsive layouts that utilize dramatically different image sizes at different resolutions.
Ideally, this could enable developers to start with mobile-optimized images in their HTML and specify a larger size to be used for users with larger screen resolutions -- without requesting both image sizes, and without UA sniffing.
It's features are:
Requirements: None
Demo: http://www.margenn.com/tubal/riloadr/demos/
License: MIT License
Ideally, this could enable developers to start with mobile-optimized images in their HTML and specify a larger size to be used for users with larger screen resolutions -- without requesting both image sizes, and without UA sniffing.
It's features are:
- No dependencies: Just Riloadr, HTML and CSS (No server involved if you don't want to, no cookies, no .htaccess, no other Javascript library or framework required).
- Ease of use: 15-30 mins reading the docs and checking some demos and you're good to go!
- Absolute control: Riloadr will process only the images you tell it to.
- One request per image: Riloadr does not make multiple requests for the same image.
- Optimal image size delivery: Riloadr mimics CSS, it computes the viewport's width in CSS pixels and the optimal image size for the viewport according to the breakpoints you set through the breakpoints option (sort of CSS media queries).
- Lazy load of images: Riloadr gives you the option to defer the load of all images in a group (faster pageload).
- Image groups: You can create different Riloadr objects and configure each one to your needs (ie: One for images in the sidebar and another one for images in the main column).
- Image callbacks: Riloadr allows you to attach callbacks for the onload and onerror image events.
- Image retries: You can configure any Riloadr object to retry n times the loading of an image if it failed to load.
- Support for browsers with no Javascript support or Javascript disabled: Use the noscript tag.
- No UA sniffing: Riloadr does not use device detection through user-agents.
- Lightweight: 4kb minified (3.45kb jQuery version minified)
- AMD compatible
- jQuery Version Available
Requirements: None
Demo: http://www.margenn.com/tubal/riloadr/demos/
License: MIT License
Trending Posts On Functionn This Week
Other Interesting Resources:
Subscribe to:
Post Comments (Atom)
Trending Posts
Popular Posts
- 20 Fresh, High-Quality Free WordPress Themes 2012
- 50 Fresh, High-Quality Free WordPress Themes 2012 - Edition #2
- The Most Comprehensive Index Of Free Icon Fonts/Iconic Web Fonts
- Timeline - A JavaScript Library For Beautifully Crafted Timelines That Are Easy, And Intuitive To Use
- BLUR.JS - A JQUERY PLUGIN PRODUCING PSUEDO-TRANSPARENT BLURRED ELEMENTS
- Selene - A Stunning & Sleek jQuery UI Theme
- jQuery UI Bootstrap Theme - Bootstrap v2.X's Theme For jQuery UI
Recent Posts
Popular Categories
- JavaScript (535)
- JQuery (275)
- Libraries (132)
- CSS (115)
- frameworks (113)
- Tools (112)
- html (86)
- Github (79)
- html5 (71)
- Node.js (58)
- mobile (52)
- Responsive (49)
- CSS3 (47)
- page effects (45)
- Web Design (41)
- Bootstrap (35)
- twitter (31)
- image effets (22)
- MVC (18)
- generators (18)
- CoffeeScript (16)
- graphics (10)
Popular Components
- icons (42)
- Graphs (22)
- popups (19)
- notifications (17)
- web fonts (17)
- visualizations (14)
- sliders (11)
- polyfills (10)
- localstorage (8)
- social media buttons (8)
Popular Licenses
- MIT License (493)
- free (144)
- GPL (64)
- Apache License v2.0 (48)
- CC Attribution 3.0 License (46)
- GPLv2 (20)
- GPLv3 (11)
- Custom License (7)
0 comments:
Post a Comment