The careful use of JavaScript can really make or break your website!
| JavaScript is undoubtedly 'the holy grail' when it comes to designing a website. There are innumerable examples of websites built on the richness of JavaScript that simply tends to pull visitors back and then back again. If that wasn't enough, JavaScript can also be used to develop awe inspiring games, APIs and scrolling abilities. |  |
Here are top 10 examples of JavaScript for your inspiration:
1. Panera Bread
-Built by Luxurious Animals.
-GPU-accelerated CSS3 animations enabled smooth animation on desktops and tablets, with programmatic transitions and JavaScript fallbacks via jQuery Transit.
-Hammer.js helped touch events. The homepage uses Isotope for the responsive grid.
-Yeoman handled scaffolding, optimisation and build processes.
-Backbone.js provided data modelling and templating for the content. The content itself lived in flat HTML files (loaded via Ajax).
-Built by the Google Creative Lab, Peanut Gallery is a Chrome experiment that lets users add intertitles to silent film clips by talking to their browser.
-Uses Google’s Web Speech API, a JavaScript API that lets developers integrate speech recognition into their web apps.
-Built by Epiphany Solutions.
-JavaScript is used to place classes on an HTML element upon a particular action such as hover, which then applies a different style using CSS animations.
4. Violin
-Built by developer Philip Roberts.
-Provides the structure of a JavaScript application and how the pieces interact by graphing them and animating them when they are used.
-Backbone has been used to write the simple to-do list style app, and the graph is drawn using D3.js.
5. Tweetmap
-Built by by Pete Smart and Rob Hawkes.
-Represents countries in the world proportionally based on numbers of tweets.
-Node.js has been used to power the server side of things. D3 has been used for rendering and animating the map (in TopoJSON format) on the client.
-D3.js (run on PhantomJS) is used on the server to render countries and generate contiguous cartograms.
6. The Trip
-Built by developer Otto Nascarella.
-Features an interactive film with audio, powered entirely through HTML5 and JavaScript.
-The JavaScript code uses jQuery for almost everything.
7. Si Digital
-Built by Alex Crooks and Co.
-The homepage features liquid moving through tubes activating an animation at each stage.
-Developed using jQuery .animate(), with its step() option to work out where the liquid was in the tube.
-Built using three.js and the canvas element.
-Follows the current minimalist design trend. Click-and-drag navigation has been used rather than the usual left/right arrows.
-Built by Florian Le Goff, features 'bottom-up' scrolling.
-A paid Typekit account was used to include uncommon fonts in two lines of code, while a few jQuery hacks and plug-ins were used to power our bottom-up reading pattern.
-jQuery.scrollTo plug-in provides an intuitive API for page scrolling.
10. MapsTD
-Built by Duncan Barclay.
-It uses the Google Maps API, with MooTools being used for the other aspects of the UI and as a general-purpose JavaScript library.
No comments:
Post a Comment