modern-web-design-and-development

(Brent) #1

Note that each of these can simulate the other with the help of an extra
line of JavaScript, like so:


1 var width = $('#someElement').width(); //returns integer
2 width = width+'px'; //now it's a string like css('width')
returns
3 var width = $('#someElement').css('width'); //returns string
4 width = parseInt(width); //now it's an integer like width()
returns

Lastly, width() and height() actually have another trick up their sleeves:
they can return the dimensions of the window and document. If you try
this using the css() method, you’ll get an error.


4. .click() (etc) vs. .bind() vs. .live() vs. .delegate


These are all concerned with binding events to elements. The differences lie
in what elements they bind to and how much we can influence the event
handler (or “callback”). If this sounds confusing, don’t worry., I’ll explain.


click() (etc)


It’s important to understand that bind() is the daddy of jQuery’s event-
handling API. Most tutorials deal with events using simple-looking
methods, such as click() and mouseover(), but behind the scenes
these are just the lieutenants who report back to bind().


These lieutenants, or aliases, give you quick access to bind certain event
types to the elements returned by the selector. They all take one argument:
a callback function to be executed when the event fires.


For example:

Free download pdf