Open Source Resources for Web Application Developers

Shopify - Online Store Builder
Follow Us on Social Sites
Subscribe RSS Subscribe Newsletter Like us on Facebook Follow us on Twitter Follow us on Google+
  • Home
  • News
  • Plugins
  • Design
  • Others
  • Books
  • About
02 Oct

Preload a Web Page with Loading Bar & Custom Animations

  • License Free, Tools
  • Leave a Comment

Yesterday, we mentioned How to Delay Images Loading. Today, we have QueryLoader which preloads images or even a whole web page with Loading bar and custom animations.

There is always a minor problem when it comes to preloading image on a website. Nobody really has a full solution for it. There are a lot of preloaders available, but most of the time they only display the words: “Loading page” or have an animated image that spins.

Why can’t there be a nice loading bar of some kind? QueryLoader has it all. Loading bar, custom animations and getting all images included in the web page.

jquery-preloader

Requirements: jQuery Framework
Demo: http://www.gayadesign.com/scripts/queryLoader/
License: License Free

Share
Tweet
Sponsors
subscribe to our newsletter - weekly free resouces for web developers
follow us on social sites - rss, facebook, google+, Twitter
Subscribe RSS Like us on Facebook Follow us on Twitter Follow us on Google+
Related Resources
Delays Loading of Images with Lazy Loader jQuery Plugin

Delays Loading of Images with Lazy Loader jQuery Plugin

Presentation Cycle with a Progress Bar

Presentation Cycle with a Progress Bar

jQuery.popeye – An Inline Lightbox Alternative

jQuery.popeye – An Inline Lightbox Alternative

Galleria – Simple but Nice jQuery Image Gallery

Galleria – Simple but Nice jQuery Image Gallery

Display a Collection of Images Without Modal Window

Display a Collection of Images Without Modal Window

Easily Create Animated Images with Animated Gif Generator

Easily Create Animated Images with Animated Gif Generator

Comments
  • http://www.vuu.com.au/ David

    Great looking preloader. Looks like they have taken some inspiration from your typical fullscreen flash preloaders, nothing wrong with that! Love it!

  • Pingback: apadmedia.com » Preload a Web Page with Loading Bar & Custom Animations

  • http://www.entersolutions.co.za/ Mo

    Damn thats cool. thanks for sharing.

  • http://www.mediashake.nl Juri

    Wow nice one!

  • http://www.DesignSquared.net Samer Kamel

    Loved it to bits .. i love having a flashy website ( yeah i am that silly ) this satisfies my needs and since i hate flash this will be used on my website very soon :)

  • kunal

    superb…

  • http://www.josephszenasi.com/ Joseph

    Very nice. Thanks for sharing it.

  • http://www.phoechan.com phoechan

    Cool Nice one but conflit with mootools.js
    How to solve that problem??
    Anyways Thanks for sharing :)

Open Source Resources for You

What we need is a list of the top quality resources, so that we can spend more time on our web development. WebAppers only picks the top quality web development resources for you.

© Copyright 2012 WebAppers | About | Archives | Privacy Policy | Advertise | Contact

Sponsors
Advertise Here
Search
By Keywords
30 Days / All Time
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • Professional Business Cards Made By Designers
  • Best Free Chrome Extensions for Web Developers
  • All of the Best Free WordPress Themes You Need
  • How to Create a Web App Admin User Interface
  • Nice List of Open Source Fish Eye Menu
  • Best Web Admin Templates
  • 25 Useful Blogs for Web Design & Development
  • Simple Javascript Progress Bar with CSS
  • 10 Useful & Quality Design Resources
  • Free Web Application Icons
  • How to Create High-Performance Code
  • How to Create Realtime Multi-player Games in HTML5
  • A True Responsive jQuery Lightbox Plugin for Free
  • Create an Amazon-like Navigation Menu with jQuery
  • Pretty Neat jQuery Mobile Theme Based on Flat UI
  • Super Smooth CSS Transitions for jQuery
  • Free Responsive HTML5 + CSS3 Site Templates
  • How to Use Web Workers for Image Manipulation
  • How to Make FullScreen Page Transitions with CSS
  • Ghost: A Revolutionary Open Source Blogging Platform
Sponsors
Plugins
  • Advertisement15
  • Calendar47
  • Capture19
  • Charts55
  • Chat22
  • Demo Tour16
  • Gallery121
  • Maps30
  • Menu87
  • Polls9
  • Popup49
  • Tooltips42
  • Upload33
  • Video18
Desgin
  • Brushes11
  • Buttons25
  • Color Schemes25
  • Fonts47
  • Forms112
  • Icons108
  • Patterns24
  • PS Tutorials15
  • Stock Photos21
  • Tables25
Others
  • Announcement103
  • Best Collections6
  • Code55
  • eCommerce24
  • Framework215
  • Hosting13
  • Information240
  • Inspiration32
  • Legal Documents10
  • Reviews8
  • Security13
  • Social28
  • Sound16
  • Stats39
  • Tools294
  • Webmail14
Licesnes
  • BSD License67
  • CC License123
  • GPL License224
  • LGPL License40
  • License Free740
  • MIT License411
Sponsors
Advertise Here
Partners
MaxCDN