I created a class focusing on jQuery class called jQuery: Enhancing Web Development at LVSOnline.com. This class is geared for web designers to help and learnand use jQuery to enhance existing web pages as well as web developers to teach them how to use a very popular and powerful JavaScript library.
If you’ve spent any time at all trying to add dynamic functionality to your pages, you’ve found that you’re constantly following a pattern of selecting an element or group of elements and operating upon those elements in some fashion. You could be hiding or revealing the elements, adding a CSS class to them, animating them, or modifying their attributes.
Using raw JavaScript can result in dozens of lines of code for each of these tasks. The creators of jQuery specifically created the library to make common tasks trivial.
The class will be teaching not only how to use the many functions and properties of API, but practical examples you can use right away.
The class is only $30 and there are no other materials or software needed to purchase.
Topics covered:
Week 1: jQuery Overview; using $(), how selectors work
Week 2: Using filters, traversing the document, statement chaining
Week 3: Manipulating page content, working with CSS content
Week 4: Events: bind() and unbind(), helper functions, event object
Week 5: UI Library: Widgets, Interaction and Effects
Week 6: jQuery Project: Adding jQuery to an existing website
To give you an idea of how each lesson looks, here is the first lesson (.pdf).
When Does Class Start?
The class runs five times a year for six weeks in January, March, May, August and October. To learn more view the course description page and contact me to find out the exact date on when you can register.
In a recent Boagworld podcast, Paul Boag interviews John Resig, creator of jQuery. Boagworld is a weekly podcast show that talks about topics for people who design, develop and run websites.
In this snipet of the full weekly podcast, Paul asks John questions such as: when is it appropriate to use a JavaScript library; do people need to learn JavaScript before using a library, do libraries hide too much, what are some pros and cons of choosing a library, and much more.
Feel free to listen to all Boagworld’s podcasts or learn and talk to other fellow designers in their forum.
jQuery methods are used to display the hovering image labels shown underneath each thumbnail as well as display the full-size image. A background grey layer is also displayed to “disable” the other thumbnails until a “close” button is clicked. This image viewer is a little more stylish and more in tune to what you see today in other examples on the web.
And if JavaScript is disabled or not available in the browser, the image(s) will still be displayed (on a new page), so the script still retains its core functionality and stays “unobtrusive”, which really is important.
read more…
The people at Refcardz have a great cheatsheet on jQuery Selectors (.pdf).
jQuery selectors are one of the most important aspects of the jQuery library. These selectors use familiar CSS syntax to allow page authors to quickly and easily identify any set of page elements to operate upon with the jQuery library methods. Understanding jQuery selectors is the key to using the jQuery library most effectively.
A whole component of the jQuery library is dedicated to the detection and reaction of standard browser events which are likely to occur frequently (during every visit to our page) when visitors view our pages.
One event that is used almost every time the jQuery library is engaged is the ready event. This can be used with the $(document).ready(function(){});. This will execute the code within its curly braces when the document is ready (once the page has finished loading minus images).
read more…
A relative latecomer to this world of JavaScript libraries, jQuery has taken the web development community by storm, quickly winning the support of major websites such as MSNBC, Google Code, and well-regarded open source projects including SourceForge, Trac, and Drupal.
Compared with other toolkits that focus heavily on clever JavaScript techniques, jQuery aims to change the way that web developers think about creating rich functionality in their pages.
Rather than spending time juggling the complexities of advanced JavaScript, designers can leverage their existing knowledge of Cascading Style Sheets (CSS), Extensible Hypertext Markup Language (XHTML), and good old straightforward JavaScript to manipulate page elements directly, making more rapid development a reality.
Checkout this article (.pdf) by Dan Wellman covering the basics of this library.
