content top

20 New examples of advanced jQuery UI’s in action.

jQuery has been one of the most widely adopted javascript frameworks for some time with the recent release of and as a result of this developers have been able to let their imagination run wild when it comes to designing exciting new interfaces. In this post I’m sharing the top 20 pages using jQuery that I felt deserved a mention – you’ll everything from fun but humble new ways to offer your users a Captcha to a completely javascript based Robot animation. Heard about the Google API but haven’t had the chance to play around with it yet? There’s an even a good Google Maps jQuery example included.  Why not take 20 minutes out of your evening to play around with some of the demos below? You could be pleasantly surprised at what you learn ; )

 

  1. A completely interactive music player powered by mouse gestures and your keyboard
  2. A a tree graph visualisation linking commenters and blog post authors done using Processing.js – a great example of real-time image processing using HTML5
  3. A really nice Ajax based Captcha using draggable components and jQuery
  4. The vertical-sliding Portfolio – a great example of how to use jQuery for animations effectively
  5. jQuery and GoogleMaps – how to do use Zoom effects in the wild
  6. A jQuery dashboard like the one found on a Mac
  7. How to use jQuery to create an online version of Tetris
  8. A slick, fast jQuery based File-tree for navigation
  9. Dynamic editable charts using jQuery – learn how to create pie charts on the fly! 
  10. Create an Amazon.com style Book Sliding widget
  11. The jQuery text-resizer – resize text in a given form field using a slider component
  12. The Picture cycle plugin – create amazing animated image effects using minimal code
  13. Create a beautiful filterable portfolio of websites or other content using jQuery (recommended)
  14. Scrollable – a nice scroller for making any div content scroll smoothly within a carousel
  15. A jQuery animated Robot cartoon powered completely by JavaScript and CSS
  16. A slick sliding login panel
  17. Create a smooth tabbled menu like the type found in many Web 2.0 wordpress templates
  18. The m.b ideas jQuery menu using Ajax for content retrieval
  19. The BBC Radio 1 Zoom tabs – used to zoom out images using your mouse
  20. A jQuery version of the Tumblr OpenSocial sharing widget
Bookmark and Share
Share

Related posts:

  1. 22 Excellent Examples of Advanced jQuery UI's in action jQuery is one of the most widely adopted javascript...
  2. 12 new examples of Advanced Animation techniques with jQuery When you think about animation on the internet, chances are...
  3. jQuery UI Animation Effects The jQuery UI Effects Core brings a few more...
  4. The Best Advanced Animation techniques you can perform using jQuery When you think about animation on the internet, chances are...
  5. Quick and dirty Ajax with jQuery So you’ve read up on our earlier Ajax tutorial or...

Related posts brought to you by Yet Another Related Posts Plugin.

5 Comments »

  1. avatar comment-top

    Great list… thanks for the compilation…

    I will use this list tomorrow on my javascript tutorial :)

    comment-bottom
  2. avatar comment-top

    Although example 2 is using jQuery, it’s not using either Processing.js or any image processing using HTML5. It’s using the (brilliant) Raphaël library by Dmitry Baranovskiy, which sits atop VML (in IE) or SVG (in everything else). See http://raphaeljs.com/ for more info…

    comment-bottom
  3. avatar comment-top

    Hi there,
    I am searching from jQuery examples of text with images where both fade in and out. I have found jquery slide shows with nice fade out transitions but not both. (image + text)

    Any assistance would be greatly appreciated.

    comment-bottom
  4. avatar comment-top

    Great list!
    What do you think about this example article?
    http://justcoded.com/article/jquery-examples/ – I think it’s very clearly to show effect directly with site elements!

    comment-bottom
  5. avatar comment-top

    what is procedure to use jquery in asp.net

    comment-bottom

RSS feed for comments on this post.

Leave a comment