10 Cool Websites with Amazing jQuery Effects

10 Cool Websites with Amazing jQuery Effects

10 Cool Websites with Amazing jQuery Effects


jQuery framework is getting really hot nowadays. A lot of websites have started to use it as the javascript framework. For myself, I too stick with jQuery because it has a really good documentation, a lot of tutorials out there (I have written heaps of them as well :) ), heaps of plugins available and most importantly it's pretty stable and supported by most modern browsers.

Before jQuery, I hated javascript, but now, jQuery has changed thing around, it has changed the way we code javascript and make it really easy and enjoyable! Alright, too much of compliments (by the way, noone pays me to say that).

Alright, it's time to show you something cool. Check out the following websites, they all are using pretty amazing animation and intensive javascript effects!

  • Andreas Hinkel
    Andreas Hinkel
    This website has a palaroid navigation menu that uses jQuery for the animation effect.
  • Kobe
    It has a pretty unique slider. From what I can see is, I think the main slider and the description bar should have different interval for the animation and thus created such a beuatiful and slick sliding effect.
  • Grooveshark Widgets
    Grooveshark Widgets
    Massive amount of cool jQuery scripts are used by this website. You have to check out the form element, and the widget selector.
  • Jon White Studio
    Jon White Studio
    It's a blog but with a cool navigation menu on the top.
  • Lisa Pram
    Lisa Pram
    I have to say, this is another cool website that uses jQuery as the javascript framework. It as a simple design but astonish animation. I really couldn't understand the navigation menu though.
  • Museu Gulbenkian
    Museu Gulbenkian
    This used to be Alex Buga's website. But he sold the design to a museum. It has a well-implemented drag dock in the bottom. You need to see it!
  • Sapphire Sound
    Sapphire Sound
    A flash like website. It has different kind of jQuery effect. First of all, the image gallery thumbnail caption effect, custom scrollbar, and you also can see the fading, sliding animation.
  • Slice Machine
    Slice Machine
    This website has been around for quite a while. But whenever I look at it, I really like the animation for their product/service packages.
  • ThinkAV
    This is a really cool website. It doesn't have an outstanding design, but it looks like a flash website, but underneath it, it's purely Ajax and jQuery animation.
  • Utah.travel
    This website full of custom built jQuery script. Image Slider, tab interface and an attractive & customized side menu. I haven't really seen this kind of menu before, so I bookmarked it and share it with you all.
  • WebMynd
    Another amazing website. It's quite hard to figure it out how it works. Anyway, the website is well designed and beautifully crafted :) Very smart idea.

Author: Kevin Liew

Kevin Liew is a web designer and developer and keen on contributing to the web development industry. He loves frontend development and absolutely amazed by jQuery. Feel free to say hi to me, or follow @quenesswebblog on twitter.

Share the love


Tue, 9th March 2010
Cool lkist, some interesting inspiration. Reply
Tue, 9th March 2010
Amazing Websites! Thanks. Reply
Wordpress Wiz
Tue, 9th March 2010
Good examples. I think if you get into learning raw Javascript , you would def appreciate Javascript frameworks a lot more. Reply
kevin Admin
Tue, 9th March 2010
Yea, i'm agree with you... I wouldn't love jQuery so much if I hadn't went though the though raw javascript... Reply
Jordan Walker
Tue, 9th March 2010
Those are all great implementations of jQuery. Reply
Tue, 9th March 2010
If you plan to make another list of website please take a look at mine too: http://pupunzi.com

I'm a jQuery developer and I've published several jQuery plugins. Reply
Tue, 9th March 2010
It was interesting to read this article and I hope to read a new article about this subject in your site in the near time. Reply
Paul Bennett
Wed, 10th March 2010
Soem really nice websites here! when you refer to WebMynd, can a website that is"quite hard to figure it out how it works" really be well designed? Maybe visually, but in terms of UX and ease-of-use, maybe not? Reply
kevin Admin
Wed, 10th March 2010
Hi Paul, sorry bout the wording, I meant the jQuery animation is well-designed and beautifully crafted :) Reply
Thu, 11th March 2010
Paul - agreed, but it's the classic Functionality vs. Design argument. Most of the sites just took a second to figure out. Lisa Pram's site on the other hand, that was a mess! The nav slivers were hard to click and half the time the picture didn't even show. Reply
Thu, 11th March 2010
I like grovesharks the best. Reply
Web Design Kent
Fri, 12th March 2010
jQuery is hot, the sites you mention, too!
And in the times of broadband internet access, who cares about a few MegaByte?

Thanks for this entry. Reply
Fri, 12th March 2010
wow ! thank for article Reply
Thu, 18th March 2010
What about: http://idsreklama.com !? Reply
Fri, 23rd April 2010
Worthful sharing to be shared with everyone. Reply
Thu, 27th May 2010
those websites are like an orgasm Reply
Fri, 18th June 2010
Does Any one know how to design these great websites, or are there websites that teach how to build these from scratch? Reply
Tue, 6th July 2010
same content as this: http://ezingsoft.com/?p=169 Reply
Wed, 18th August 2010
I am very like the jquery
Please help me I want ti made this design (http://www.microsoft.com/windows/internet-explorer/default.aspx)
but I don`t do it.
Please teach me. . . . Reply
Fri, 28th January 2011
I don't think you really want it. Learn how to do it if you really want it. Reply
houston webdesign
Wed, 25th August 2010
Slice machine is superb. Thanks for sharing it. Cheers! mate Reply
Web design hippo
Thu, 23rd September 2010
Wow, some cool websites here.

I like Andreas Hinkel's Celtic website... Nothing to do with the fact that I support them either!

Some great ideas can be taken from these. Reply
Bjorn @ WSN
Sat, 25th September 2010
Really like the "Slice Machine" site's effect. Used something similar on my own site for the nav. Nice work. Reply
Wed, 13th October 2010
http://urlPass.com/67rk this one is cool to..give a try awesome collection of intresting and cool website Reply
Wed, 9th February 2011
I cant believe that people getting excited about some of these sites.. most of these listed here are nowhere near worth mentioning, especially in jquery category. just because the polaroid-like photo move few pixels on hover dosent mak it cool especially in 2011, not hating just telling the truth. some sites look very decent but are far from "special". Use google people you will find many more and better on first few listing pages Reply
I AM...
Fri, 29th April 2011
Nice... And this one http://www.jesperschelling.nl Reply
Thu, 29th August 2013
hello there, I just checkout your site you posted The images need to be more low res they take tyo long to load and there are a few big bugs
Thanks- Reply
Tue, 9th August 2011
Thanx this website. Reply
Wed, 10th August 2011
Does anyone know any websites similar to these that are sports related? Like the Andreas Hinkel one.. Reply
Mark Plunkett
Tue, 16th August 2011
It might not be exactly what you are looking for but what about the new Nike Website? The Nike Better World website uses HTML5, CSS 3 and JavaScript to create a unique scrolling storyboard-style experience... Reply
Wed, 28th December 2011
thanks for the information.. the website is awesome!! Reply
Bilal Shah
Fri, 30th September 2011
Sir I want to teach. Can you will teach me plz sir i am pakistani and professionally a web developer Reply
Tue, 6th March 2012
I meant the jQuery animation is well-designed and beautifully crafted :) Reply
Will Daniels
Thu, 8th March 2012
I was inspired by this article and added some really cool jquery to my site (http://creativecitrus.com/). Reply
Sun, 3rd June 2012
I also hated JS before discovering jQuery. I avoided it by all costs, because it has a nasty syntax and is very limited. But a couple of month ago, when I discovered jQuery, it all changed. with a single line of code, you can change the world! This is really cool and it helped me to build some amazing efects on my website http://www.678voli.it/ in no time. If you want, you can take a look at it and maybe consider including it in your list! Reply
Mon, 10th September 2012
sry, but only bad UI in this examples with slow JS and without crooss-browse. Reply

Leave a Comment

Please keep in mind that comments are moderated and rel="nofollow" is in use. You can use [code][/code] if you want to write codes. Don't spam us :) Thanks!