10 jQuery Plugins to Enhance your User Interfaces

By / Sep 20, 2011 / Tools
shares

With a recently estimated over 20 million websites currently using jQuery it is essential to know what jQuery plugins there are out there in order to stay with the web design trend. Today, we’ll put some focus on some popular jQuery user interface plugins to help you enhance your current website to stay ahead of the crowd!

jQuery Image Parallax

Ever wanted an animated header but refused to put Flash on your website? Well, there is now a jQuery plugin which allows you to do just that with, you guessed it – zero Flash! It creates an overlay of images and animates them when your mouse hovers the header. Get that WOW factor with jQuery Parallax.

jQuery News Ticker

Ever wanted to display the latest news on your website in a sort of “headline news” way. Well, this jQuery News Ticker plugin will not only display your latest news it can also be loaded in from an RSS feed. This would allow you to display news from any website which has an RSS feed. Pretty cool!

jQuery Letterings

This awesome little jQuery plugin creates eye catching fonts, typical called web typography! It’s lightweight, easy to use and can really transform that ugly looking heading you’ve always hated into something quite spectacular. There is also a CSS3 fall back for those people who might (for some unknown reason) have JavaScript disabled.

jQuery Stylesheet Switcher

Designing a web page and can’t decide what styles to choose for a client? Well, this little jQuery plugin lets you switch stylesheets instantly with just a click of a link! Now you can switch back and forth when showing choosing designs with clients.

jQuery Page Peel

This little jQuery plugin which does exactly what it says on the tin – creates a page peel! This is a little page animation which sits at the top right hand of the screen and when the mouse hovers it the page “peels” down and reveals the content behind it. It could be used to display a popular area or feature of your website but is most commonly known these days to display advertisements. Let’s face it the page peel grabs your attention straight away!

jQuery Simple Modal

Lets face it, alert boxes which display things like “Wrong password” or “Saved.” are outdated! Well fortunately these days are over and there a few good jQuery plugins out there that manage modal boxes. These modal boxes are essentially windows which can be style customized to suit your website! The simple modal is my favorite as it’s so easy to implement and manage.

jQuery Scroll Slider

Ever wanted to grab someones attention when they are reaching the end of a web page, essentially to keep them from closing it? Well, with the jQuery Related web pages Scroll Slider you can do just that! As the visitor reaches the end of the page a sliding animation with slides out from the bottom right of the screen! Great Stuff!

jQuery Position Absolute

This nifty little jQuery plugin can make products fit on screen creating an interesting way of displaying them so that they are all visible. Now your days of reducing the size of your images to small thumbnails are over with this fantastic jQuery plugin.

jQuery Easy UI

This awesome jQuery plugin allows you to create amazing professional looking websites with ease. There are a whole range of demos of the different types of components to get you started. I have noticed it can be particularly useful for displaying data in tables using a DataGrid layout. It is very easy and yet so powerful!

jQuery iFrame/textArea Resizer

OK so you are using an iFrame to display a web page, form or images on your web page. iFrames usually have a fixed height and are a pain to resize across the different browsers. This little jQuery plugin allows you to resize iFrames and textAreas on your page with a nice grip bar, hassle free!

About the Author

Sam Deering is a professional JavaScript & jQuery developer and founder of a popular jQuery Blog. He is currently working as a Web Developer for Flight Centre Australia.

14 Comments

  1. Dowdy
    September 20, 2011

    Awesome post, I especially love the jQuery Image Parallax I’m going to use it on my website header! Thanks!

    Reply
  2. Yordan
    September 20, 2011

    Nice article. I love jQuery. I can make with jQuery almost everything. Thanks.

    Reply
  3. John McMullen
    September 20, 2011

    Just a note on the jQuery PagePeel. I created this a few years back and although it’s nice if I were to use this today I’d go with this guy: http://elliottkember.com/sexy_curls.html

    Mine requires Flash which a certain tablet *ahem iPad* doesn’t like.

    Reply
  4. Dzinepress
    September 20, 2011

    really helping article for my development team. thanks

    Reply
  5. Sam
    September 20, 2011

    @John,

    The Sexy Curls Plugin Looks really good, I like the way you can drag it out! I’ll share this one on jQuery4u.

    Thanks guys!
    Sam

    Reply
  6. Lauren
    September 21, 2011

    Thanks so much. Lettering.js will come in handy, excellent.

    Reply
  7. Aaron @ iamcreative.me
    September 21, 2011

    Great!

    Off to have some fun with the lettering.js and parallax… Been trying to figure out how to do the same in CSS. Browser compatibility put a stop to that though.

    Reply
  8. Paul
    September 24, 2011

    Nice list.

    Like the Image Parallax example.

    Reply
  9. Timbre Lumpaz
    November 17, 2011

    Hey, very nice and useful collections, check also what I found, a nice wizard creation ajax Login form http://www.devstring.com/jlogin

    Reply
  10. Yordan
    December 11, 2011

    I like News Ticker. Good work.

    Reply
  11. Dennis
    December 14, 2011

    Nice.

    What do you think of this: http://kiro.me/textualizer

    Reply
  12. Webdesign München
    February 3, 2012

    Wow – just was surfing around a little bit and found your awesome blog! Really great stuff and interesting articles. I’ll be back for sure in future. Keep on rockin.

    Andi

    Reply
  13. Web Design Solution
    June 10, 2012

    Many thanks for this tutorial. Actually i did read almost everything about jquery and this one was by far the best articles i read. It makes the website rock!

    Reply
  14. Michael
    January 18, 2013

    Wow – you guys have endless jQuery resources on here. Tons of lists to go through. Thanks so much!

    Reply

Leave a Reply