Getting Creative With Javascript: 15 Websites With Cool Slider and Scrollers

56

Posted on 24 September 2008 by yugu

The Most Important thing is not -what you say, the important thing is -how you say and when you say , While some days before we are using flash for buttons, gallery etc, later now JavaScript frameworks like mootools , scriptallicious and prototype replace the flash with a light weight code and we can get the same effect like flash

But how to use them effectively in such a way it wont distract the users attention and it should add value to the website, have a look at the 15 Sample Websites below which use JavaScript animations effectively

1. YouLoveUs

Javascript Animation Effectively

2. Volll

Javascript Animation Effectively

3. Melissahie

Javascript Animation Effectively

4. SourceBits

Javascript Animation Effectively

5. ilFruttet

Javascript Animation Effectively

6. Danny Blackman

Javascript Animation Effectively

7. tatTAPtap

Javascript Animation Effectively

8. Coda ( Classic )

Javascript Animation Effectively

9. Lucuma

Javascript Animation Effectively

10. Komodo Media [ Don't Forget to Check the Foilage Meter ]

Javascript Animation Effectively

11. Viva Video

Javascript Animation Effectively

12. IJsfontein

Javascript Animation Effectively

13. Good Works Media

Javascript Animation Effectively

14. Viget Labs

Javascript Animation Effectively

15. Css Brigit

Javascript Animation Effectively

Tutorials + Scripts [ So you can Try this effects in your next Project ]

Dzineblog Rss Feed

If You Like This Article Please Share These icons link to social bookmarking sites where readers can share and discover new web pages.
  • StumbleUpon
  • del.icio.us
  • bodytext
  • Sk-rt
  • Technorati
  • Sphinn
  • description
  • Reddit
  • BlinkList
  • Facebook
  • PlugIM
  • Mixx
  • MyShare
  • Spurl
  • Slashdot
-->

30 Comments For This Post

  1. printing capalaba Says:

    Just before I comment you do have a typo on the very first line, it says “The Most Important think” should read *thing*

    That aside while javascript can be use you need to maintain a site that degrades gracefully. My tendency is to stay away from flash/javascript or any other flavour, if it can be avoid. Rather sticking with xhtml/css you still have virtually limitless possibilities, and are more SEO friendly.

  2. printing capalaba Says:

    I should note the above does refer to styling menus only. javascript/flash can still be used thoroughout a site.

  3. Sheevaa Says:

    Nice Collections da bujju… It’ll really help me…..

  4. Michael Says:

    Not sure if you can add our site to your list. We use ExtJS on our site to provide a richer experience to our potential customer.

    http://www.gamesportal.com.au

    Let me know what you think.

  5. Jeremy Says:

    I like these as concepts but they should really load the rest of the page as you click rather than be a single page that is 2-3mb in size

  6. Andris Says:

    Nice collection. I really like those JavaScript sliders and scrollers.

  7. Dave Says:

    I love the slider used on Panic’s site, I have used the same effect on a site I am working on at the moment, There is a great jQuery plugin available for this, you can check out the plugin here:
    http://www.ndoherty.com/blog/

  8. ceasar Says:

    Here another one
    http://www.imageflow.nl
    Slideshow with picasa, youtube and dailymotion video’s

  9. Tom Says:

    wow. thanks for the list

  10. alex Says:

    I would add to this list my website.

    http://www.brilliancy.eu

  11. Ben Says:

    This is an awsome list.

    Apart from the pedantic first poster @printing capalaba who can’t seem to tkae his own advice

    “That aside while javascript can be use you need to maintain a site that degrades gracefully.”

  12. Jack McDaniel Says:

    Nice. I think my favorite JS technique is Blendimages. It adds a nice change to a site without being too ‘heavy’ and obtrusive.

  13. Matt Says:

    The first site (YouLoveUs) doesn’t work in IE6 like it does in FF. %25 of the population can’t see the site correctly? That is not good web design.

    The second site (volll) is a single page site with a large load time.

    I didn’t look at the rest. They may be good examples for the future, but have big problems for users currently.

  14. dani Says:

    TO Matt:

    It depends on your targeted audience , if my site is going to be about tech then i wont care about the 22% who still working on IE 6 , who doesn’t have any idea about whats going on over the internet

  15. Dainis Graveris Says:

    Really creative designs You picked! Love jquery :)

  16. hari Says:

    good collections… like to see more like this.

  17. Grafiko Says:

    great list. Got’ love jquery

  18. jean-guy Says:

    another one : http://www.tcommeterre.com/portfolio.html

  19. tommy Says:

    These are great. Thanks for gathering this information and posting.

  20. Rob W Says:

    Another one: http://preetasamarasan.com
    Uses mootools as many of these sites do, not jQuery.

    Agreed, it’s important to keep usability in mind, so you have to know your audience and their needs. These can be impressive on a portfolio-type site, but you wouldn’t want time-consuming special effects on a site where users are constantly navigating (it’d definitely get old…).

  21. Tyler Says:

    Yet again, great collection!!!!!

  22. Julia Valencia Says:

    Beautiful sites. I like javascript.

  23. John Says:

    Not bad, with the exception of melissahie.com. The one-way navigation is pretty annoying…

  24. Jam Says:

    Loved the trip!. I am going to translate it in order to let my readers and classmates enjoy the post. Yugu, you ROCK!.

  25. erewr Says:

    wrwerwr

  26. W3bworld Says:

    Hi the collection is handy just one thing my anti-virus brings up a threat for the http://www.volll.com/ thanks keep up the gud wrk…..peace

  27. Las vegas Web design Company Says:

    Nice list. Please add this
    http://maxdistro.com/services.html

    Thanks
    Farhan parpia

  28. bebo skins Says:

    awesome collection, however dont search engines struggle to crawl javascript based sites?

  29. fethiye Says:

    Thank you very much.

  30. Devpkj Says:

    This is too Good Website i relay thanks dzineblog

26 Trackbacks For This Post

  1. 15 sitios web con navegación a base de sliders | frogx.three
  2. 15 Websites With Cool Slider and Scrollers - Kreativuse™ - Creative Resources and Inspirations
  3. akie.nl » 15 cool websites
  4. [root@EGA]# » Blog Archive » links - 20080925
  5. Sosyal ?m - Teknoloji haberleri » 15 Yarat?c? JavaScript Sitesi » Blog Ar?ivi » 15 Yarat?c? JavaScript Sitesi
  6. Link Love 09.28.08 | lustrious
  7. Higherweb ::: Le BLOG » Blog Archive » Revue de Web semaine 39
  8. Webfundstücke | Kaine
  9. Links: Recopilación Twitter v2 - kcxlife.net
  10. Best of September: This Month in Web Design | Vandelay Website Design
  11. Ugens links på del.icio.us (22.09.08 - 27.09.08) | Morten Gade
  12. 15 Websites With Cool Slider and Scrollers Using JavaScripts - Hidden Pixels
  13. Come essere creativi con javascript « Fedeweb
  14. Best Of Design - September
  15. Antilogic Media » Blog Archive » Antilogic Media - Design, Technology, SEO, Online Marketing and more…
  16. 15 Websites With Cool Slider and Scrollers [DzineBlog]
  17. Pieter van Boheemen | 2008 Wrap up: CSS & XHTML
  18. Yeni Teknik Kayan Siteler · Yakup Gövler'in Not Defteri
  19. Web Design Inspiration - 25 Websites With Beautiful Background Part II | SulVision
  20. Sosyal ?m - Teknoloji haberleri » Web Tasar?mc?lar ?çin 15 Javascript Slider ve Scroller » Blog Ar?ivi » Web Tasar?mc?lar ?çin 15 Javascript Slider ve Scroller
  21. Web Tasar?mc?lar ?çin 15 Javascript Slider ve Scroller
  22. Web Tasar?mc?lar ?çin 15 Javascript Slider ve Scroller | bildirgec.org * bildiri * çok tutulanlar * soru & cevap * tümü Tuttum Web Tasar?mc?lar ?çin 15 Javascript Slider ve Scroller | Bedavam.Net |
  23. Sliding… navegação por rolagem…. - design+lovrs
  24. Web And Graphics Design Tutorials » 50 Beautiful Website Designs For your Inspiration - 25th Edition
  25. Web And Graphics Design Tutorials » 50 Beautiful Website Designs For your Inspiration - 51th Edition
  26. Web And Graphics Design Tutorials » 50 Beautiful Website Designs For your Inspiration - 150th Edition

Leave a Reply

Agency Tool Vyoopoint Free CSS Website Templates

Friends