Navigation

Home
Search
Submit A Resource
Contact Us
About Functionn

Subscription Options


Subscribe By Email (265+)


Lists


Archives

Apr 18, 2012

Author: Hirvesh Posted At: 4/18/2012 Tags: , ,

Riloadr - A Cross-Browser Framework-Independent Responsive Images Loader

Share:
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:
  • 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
Demohttp://www.margenn.com/tubal/riloadr/demos/
License: MIT License

Daily Posts, Be Updated, Subscribe:

Want Free Web Resources? Enter Your Email And We'll Send It To You - Daily! (265+ Subscribers)

Yup, it's that straight forward! Enter your email address below and we'll send you the latest web resources to your inbox, everyday. We don't do spam. Ever.

Trending Posts On Functionn This Week

Share:

Other Interesting Resources:

0 comments:

Post a Comment

 


Recent Posts

Popular Categories



Popular Components



Popular Licenses