Learning Javascript (for designers)

MAY 12TH 2012

Javascript is quickly becoming a world class language.. If you a designer who actually builds prototypes (or things for production) chances are you need to be familiar with it.

Look at you.
follow me — @malcolmtyson
jQuery is your friend - Include it in all your projects. It will make your life 10 times easier and makes picking up JS easier as well. Download jQuery here.
Use existing plugins/extensions. Don't try and reinvent the mothafuckin' wheel. For example - If you need a slideshow, use one that already exists (like the nivo slider). Google is your friend in this regard.
Grasp selectors and events - If you must learn one thing about Javascript or jQuery ... learn selectors and events. You're a designer right? You should know CSS, so it will be easy to pick up. Here are a few examples.

 

Select all divs and make the background red.

     $('div').css({background: 'red'});

 

Disable all inputs with the class "disabled."

     $('input.disabled').prop('disabled', true);

 

CRAZY SHITT. When you click a link where the id="fadeEverything", CHANGE THE OPACITY TO LIKE 15% in this bitch.

$('a#fadeEverything').click(function(e) {
     e.preventDefault();
     $('body').animate({opacity: 0.15});
});
Get busy! There is obviously a lot more to javascript than just this. It is a programming language... but as far as designers are concerned, these points should prove beneficial.


This is the part where you close your browser and open Dreamweaver and get crackin'!



If you liked this — you should follow me on twitter.

Read More Posts »