-
Jan 12, 2010
How to use keyboard navigation to control a carousel and/or slider.
Filed under: Carousel, DOM Manipulation, Slideshow
-
Jan 07, 2010
How To Use JSON with Twitter and Flickr API
In this post I want to illustrate how to use jQuery getJSON() method to load JSON data using an HTTP GET request. I prepared two examples, easy to understand if you are a jQuery beginner. The first example is a simple Twitter search and the second one is a simple Flickr search.
-
Create an In-Place Editing System: One Step Further
We’ll take things a step further as we create a simple backend, which will allow our website to remember the changes that we’ve made.
-
Create an In-Place Editing System
Making users click through multiple pages just to edit a field is so 1999. In this tutorial, you’ll learn how to create an in-place editing system as found on popular sites, such as Flickr.
-
Dec 16, 2009
Building Custom jQuery Event Types: Hesitate Event
If you’ve worked with jQuery for a while, you’ve probably bound event handlers to DOM elements. And, if you’ve done that, you may have also bound and triggered handlers to event types that aren’t natively supported by the browser (ex. “drag”, “drop”)….
Filed under: jQuery Extensions
-
Dec 01, 2009
In this tutorial we are going to create a pure jQuery & CSS twitter ticker which utilizes Twitter’s Search API. It will show your or your friends’ latest tweets, and will not require any server side code or databases. As a result, the ticker will be easily included into any web page and easily modified to your likings.
Filed under: Ajax, Animation and Effects, DOM Manipulation
-
Nov 27, 2009
Making an Interactive Picture with jQuery
In this tutorial I will be showing you how to piece together an interactive picture – aka an image that contains tooltips and popup boxes. This can be useful for showing off a particular aspect of a photo (ie items or people).
Filed under: Animation and Effects, DOM Manipulation, Media, Tooltip
-
Nov 25, 2009
Horizontal tabs with slide down sub menus
Cool horizontal sliding menu
Filed under: Animation and Effects, Navigation
-
Nov 17, 2009
Retweetradar has nice little effect in the footer – links in top lists fade, emphasizing the most popular links with strongest color intensity. This tutorial will explain how to fade a color in array of elements using jQuery.
This tute uses two way to fade the content, the first being opacity and the second, using RGB values.
Filed under: Aesthetics, DOM Manipulation
-
Nov 11, 2009
Smart Columns with CSS & jQuery
A very smart solution to create a evenly spaced columns using CSS and jQuery by Soh Tanaka
Check it, you won’t regret it.
Filed under: Aesthetics, DOM Manipulation, UI
-
Nov 10, 2009
For $9 you get a great screencast tutorial from PeepCode. Check it out
Filed under:
-
Nov 02, 2009
Perfect sign in dropdown box likes Twitter
Twitter’s running a new homepage with clean and easy design. Look at the top right of Twitter’s homepage, you’ll see the sign in button which will drop down the login form. Today, I will make an entry to show you how to create a login drop down with Twitter style using jQuery. It’s really easy, it’ll help you save the space of your webpage and make visitors feel comfortable by the awesome toggle login form. This entry will explain how it works step by step and it’s good for learning jQuery how to do the toggle and tooltips.
Filed under: Animation and Effects, DOM Manipulation, Forms, Navigation
-
Oct 29, 2009
Disappearing "Scroll to top" link with jQuery and CSS
Seen in many forms, such as “Back to top”, “Top of page” or “Scroll to top”, these links provide a way for users to jump to the top of the page, back to navigation and other handy stuff.
This tutorial will help you build a scroll to top link, or whatever you call it, that appears when the user scrolls down, and disappears when users reach the top of the page using a combination of CSS and jQuery
Filed under: Animation and Effects, DOM Manipulation, Navigation, Utilities
-
Oct 24, 2009
Create an Image Rotator with Description
An image rotator is one great way to display portfolio pieces, eCommerce product images, or even as an image gallery. Although there are many great plugins already, this tutorial will help you understand how the image rotator works and helps you create your own from scratch.
Filed under:
-
Oct 20, 2009
Easy Display Switch with CSS and jQuery
Today’s web users expect web pages to be increasingly more interactive. To this end, the ability to change page layouts provides your users with a more immersive experience and allows them to consume information more easily, either with a quick gallery view, or a detailed summary view.
Filed under: Aesthetics, DOM Manipulation
Latest Tutorial
You should follow us on Twitter
You should subscribe to the feed
Categories
- Accordian (2)
- Aesthetics (6)
- Ajax (16)
- Animation and Effects (17)
- Background (2)
- Browser Tweaks (1)
- Carousel (4)
- Data (4)
- DOM Manipulation (49)
- Drag 'n' Drop (1)
- Forms (3)
- jQuery Extensions (1)
- Lightbox/Modal (7)
- Media (9)
- Preload (3)
- Shopping Cart ()
- Tabs (4)
- Text Replacement (1)
- Tips (6)
- Tooltip (6)
- Transitions (9)
- UI (8)
- Utilities (5)
- Validation (2)
Use these products, we do
Mac OS X Version 10.5.6 Snow Leopard
Windows 7 Ultimate
Moleskine Large Squared Notebook
Learning JQuery 1.3 
JQuery UI 1.6: The User Interface Library for JQuery 
JQuery Reference Guide 
jQuery in Action 
Pro JavaScript Techniques 
JavaScript: The Definitive Guide 
DOM Scripting: Web Design with JavaScript and the Document Object Model 
Bulletproof Ajax 
Bulletproof Web Design 
CSS Artistry: A Web Design Master Class 
Designing with Web Standards 
CSS Mastery: Advanced Web Standards Solutions 
HTML & XHTML: The Definitive Guide 
Follow jQuery Style on Twitter