Once again, we find ourselves opening up our favorite IDE and looking jQuery straight in the eye. However, instead of a complex script that controls an alien mothership, we are going to build some really simple, yet useful, tabs. Even though jQuery UI offers some pretty cool tab objects, it is still a very large library and sometimes you just need some simple tabs. Today, we are going to tackle this.

As usual, here at Switch On The Code we are diving into jQuery once again. However, unlike a typical foray in the Javascript world, we are going to look at some simple jQuery selectors. Not just any selectors though. Today I have some interesting selectors that you may not know about, but can be extremely useful. So let's get started.

Here at Switch On The Code we love us some jQuery. We not only have tutorials, but we use jQuery ourselves for the very site you are visiting right now. It makes the life of a web developer so much easier. Sometimes, however, there just isn't a magical jQuery function that does what you need. On occasion you need to select a bunch of stuff and do some custom logic on each element. You don't necessarily need to move all the objects or change some css, sometimes you just need to do something more your own style. This is where the each() function comes in.

We have talked about jQuery a lot over the past months, and even more since the humble beginnings of Switch On The Code. There are many reasons for this, and I am sure we all can agree that jQuery is just awesome. From its simple way of grabbing DOM elements down to its powerful extensions that make the possibilities effectively endless. But there is one thing we have covered yet... jQuery Animations.

jQuery is no doubt one of the greatest javascript resources you can get your hands one. One of the reasons for this is, without a doubt, its cross-browser compatibility which no doubt takes a lot of work to maintain. An area that this becomes more apparent is keyboard events, and more specifically, capturing such events. In this tutorial, we will be going through the basics of capturing keyboard events, which like most things in jQuery, is pretty simple.

In part 1, we went over the creation of a basic jQuery popup plugin. While this is very useful in itself, it is not that flexible yet. This time around we are going to add a few new features that will make our popup plugin way more flexible and useful. So come on and find out what cool things we will make our popup do.

While the jQuery UI library is quite powerful, and mighty impressive, its footprint is sometimes a bit too much for the project at hand. The UI library also tends to "take over" your HTML, moving it, adding classes, and sometimes even changing attributes around. This can make styling and customizing your UI elements a bit of a pain, especially when you need a custom solution. This is why sometimes you need a UI solution, using jQuery, but without the jQuery UI. Today we are going to work on a draggable popup.

With jQuery 1.8 came a brand new widget - the autocomplete input field. If used correctly, like in the case of Google's search suggestions, autocomplete can provide a major boost in productivity. Today's tutorial is going to demonstrate how to build and populate one of these autocomplete inputs. We're going to make two identical examples that get their data from two different sources - one will be client-side and the other will be server-side using PHP.

jQuery is one powerful tool for web developers. It offers a host of ways to make rich web applications even better, and easier to develop. There is no argument from us here at SOTC against jQuery and in fact we have a rich history of jQuery tutorials. But jQuery has a lot to offer other than just code helpers. Today I am going to show you something else jQuery has to offer, the jQuery UI.

Using the mouse in jQuery is really easy, and opens up a whole new world for those who use javascript. But, just about everything already has a mouse event attached to it. Images are especially tricky, usually allowing click-and-dragging by default. Today we will go over a useful function that will help you take control over just what the mouse button does on certain elements.