Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 3
Reader Level:

Every now and again a client will come to you asking for a seemingly simple thing that turns out to be far more difficult and complex than you'd ever imagined. Today we're going to start looking at one classic example: how to make an interactive jigsaw puzzle. While there are many examples on the web of puzzles based in Flash or on "straight sided pieces" (which really isn't a jigsaw puzzle is it?) there are few examples around of how to make a more realistic and lightweight puzzle from scratch.

In today's article we're going to make our puzzle more challenging by changing the orientation of the pieces and letting a user rotate them manually to where they should be. Every now and again a client will come to you asking for a seemingly simple thing that turns out to be far more difficult and complex than you'd ever imagined. Today we're going to start looking at one classic example: how to make an interactive jigsaw puzzle. While there are many examples on the web of puzzles based in Flash or on "straight sided pieces" (which really isn't a jigsaw puzzle is it?) there are few examples around of how to make a more realistic and lightweight puzzle from scratch.

In today's article we're going to spend a bit of time on the subtle but important details: randomizing the order of the pieces on load, and adding some sound-effects.

The Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery Series:
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 1
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 2
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 3
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 4
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 5: Randomization and HTML5 Audio
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 6: Grouping Pieces I
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 7: Grouping Pieces II

Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 2
Reader Level:

Every now and again a client will come to you asking for a seemingly simple thing that turns out to be far more difficult and complex than you'd ever imagined. Today we're going to start looking at one classic example: how to make an interactive jigsaw puzzle. While there are many examples on the web of puzzles based in Flash or on "straight sided pieces" (which really isn't a jigsaw puzzle is it?) there are few examples around of how to make a more realistic and light-weight puzzle from scratch.

In today's article we'll take the pieces we created in Part 1 and through a bit of jQuery and CSS turn them into a basic interactive jigsaw puzzle. Every now and again a client will come to you asking for a seemingly simple thing that turns out to be far more difficult and complex than you'd ever imagined. Today we're going to start looking at one classic example: how to make an interactive jigsaw puzzle. While there are many examples on the web of puzzles based in Flash or on "straight sided pieces" (which really isn't a jigsaw puzzle is it?) there are few examples around of how to make a more realistic and lightweight puzzle from scratch.

In today's article we're going to spend a bit of time on the subtle but important details: randomizing the order of the pieces on load, and adding some sound-effects.

The Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery Series:
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 1
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 2
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 3
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 4
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 5: Randomization and HTML5 Audio
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 6: Grouping Pieces I
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 7: Grouping Pieces II

Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 1
Reader Level:

Every now and again a client will come to you asking for a seemingly simple thing that turns out to be far more difficult and complex than you'd ever imagined. Today we're going to start looking at one classic example: how to make an interactive jigsaw puzzle. While there are many examples on the web of puzzles based in Flash or on "straight sided pieces" (which really isn't a jigsaw puzzle is it?) there are few examples around of how to make a more realistic and light-weight puzzle from scratch.

In today's article we're going to start building our puzzle by taking an image and cutting it up into individual jigsaw pieces using some handy Fireworks features and extensions. Every now and again a client will come to you asking for a seemingly simple thing that turns out to be far more difficult and complex than you'd ever imagined. Today we're going to start looking at one classic example: how to make an interactive jigsaw puzzle. While there are many examples on the web of puzzles based in Flash or on "straight sided pieces" (which really isn't a jigsaw puzzle is it?) there are few examples around of how to make a more realistic and lightweight puzzle from scratch.

In today's article we're going to spend a bit of time on the subtle but important details: randomizing the order of the pieces on load, and adding some sound-effects.

The Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery Series:
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 1
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 2
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 3
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 4
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 5: Randomization and HTML5 Audio
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 6: Grouping Pieces I
Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 7: Grouping Pieces II

jQuery Quickshots - Rotating Images in Realtime
Reader Level:

jQuery is a great tool for helping to make your JavaScript and AJAX applications easier to develop and maintain. One of the hardest things about it though, is that it introduces so many new and amazing possibilities that aren't always clearly obvious on the surface.

These "quickshot" articles are intended to act as hints, or inspirations, to some of the more creative or unknown problems that jQuery can help you tackle. Today we're going to tackle how to perform real-time image rotation in an easy and cross-browser compatible fashion!

JavaScript Pop Up Windows - Part 4: Centering a Pop Up Window
Reader Level:

We've covered the syntax of the window.open() method, including all the values of the features parameter. We've also learned about several of the window properties that are relavant to pop up windows. In this section we take what we've learned and user standard properties and well supported non-standard properties to put all that knowledge to work! We learn how to place a new popup relative to the screen and to its parent, including how to center a pop up in the middle of its opener.

The JavaScript Pop Up Windows Series:
JavaScript Pop Up Windows - Part 1: window.open Method Syntax
JavaScript Pop Up Windows - Part 2: Window Handlers, Focus, and Control
JavaScript Pop Up Windows - Part 3: Window Size & Location
JavaScript Pop Up Windows - Part 4: Centering a Pop Up Window
JavaScript Pop Up Windows - Part 5: open(), close(), focus() and blur()
JavaScript Pop Up Windows - Part 6: Moving & Resizing Pop Up Windows

JS Pop Ups - Part 3: Window Size & Location
Reader Level:

In this multi-part series we learn everything there is to know about creating pop up windows and controlling them. In this section we learn several of the properties of the window object, and how we can use those properties to determine the size and location of a browser window.

The JavaScript Pop Up Windows Series:
JavaScript Pop Up Windows - Part 1: window.open Method Syntax
JavaScript Pop Up Windows - Part 2: Window Handlers, Focus, and Control
JavaScript Pop Up Windows - Part 3: Window Size & Location
JavaScript Pop Up Windows - Part 4: Centering a Pop Up Window
JavaScript Pop Up Windows - Part 5: open(), close(), focus() and blur()
JavaScript Pop Up Windows - Part 6: Moving & Resizing Pop Up Windows

JavaScript Pop Up Windows - Part 1: window.open() Method Syntax
Reader Level:

In this series we're going to cover everything you could possibly want to know about JavaScript pop up windows. In this section we cover the semantics and values of creating the pop up window. In the next section we cover controlling the pop up windows once opened.

The JavaScript Pop Up Windows Series:
JavaScript Pop Up Windows - Part 1: window.open Method Syntax
JavaScript Pop Up Windows - Part 2: Window Handlers, Focus, and Control
JavaScript Pop Up Windows - Part 3: Window Size & Location
JavaScript Pop Up Windows - Part 4: Centering a Pop Up Window
JavaScript Pop Up Windows - Part 5: open(), close(), focus() and blur()
JavaScript Pop Up Windows - Part 6: Moving & Resizing Pop Up Windows

Party Favourites: The Group Slideshow - Part 2
Reader Level:

The advances in mobile technologies and the rapid growth of portable computing devices has brought the reach of the web into entirely new and unexpected places. In this article we're going to look at one particular example that I ran into recently: mobile slideshows, or live photocasting if you will. It helped to make a recent party of mine a roaring success, and it really wasn't that hard to do!

Here in Part 2 I'll show you how to build the "slave" script that will synchronize itself with the "controller" that we created last time. We'll also look add a thumbnail gallery to our controller page.

The Group Slideshow Series:
Party Favourites: The Group Slideshow - Part 1
Party Favourites: The Group Slideshow - Part 2

Party Favourites: The Group Slideshow - Part 1
Reader Level:

The advances in mobile technologies and the rapid growth of portable computing devices has brought the reach of the web into entirely new and unexpected places. In this article we're going to look at one particular example that I ran into recently: mobile slideshows, or live photocasting if you will. It helped to make a recent party of mine a roaring success, and it really wasn't that hard to do!

The Group Slideshow Series:
Party Favourites: The Group Slideshow - Part 1
Party Favourites: The Group Slideshow - Part 2

Finger-Friendly Mobile Web - Part 3: Physical Sizes
Reader Level:

The web is moving beyond the confines of computers, thanks to the advent of smart phones and high-speed cellular networks. This is changing not only the way we think about connectivity and the net, but also the ways in which we access and interact with information. The rise of the touch screen and smart phone are bringing a myriad of new challenges, and opportunities, our way.

In this series we're going to explore how we, as web developers, need to adapt in order to take full advantage of these changes and continue to provide new and exciting user experiences. We're going to learn to conquer the "finger-friendly mobile web"!

In the third part of this series we're going to continue exploring the information density problem by talking about mobile screen sizes and how they impact usability.

The Finger Friendly Mobile Web Series
Finger-Friendly Mobile Web - Part 1: An Introduction
Finger-Friendly Mobile Web - Part 2: Screen Sizes vs Density
FInger-Friendly Mobile Web - Part 3: Physical Sizes

Firebug - Part 7b: Debugger, Breakpoint & Expression Watching
Reader Level:

In this section of a multi-part series about Firebug, the premier (and free) web development tool for Firefox, we learn about setting breakpoints in our JavaScript to enable debugging via Firebug's Script tab.

The Firebug Series:
Firebug - Part 1: The What and Why
Firebug - Part 2: Overview of Firebug Functionality
Firebug - Part 3: Editing with Firebug
Firebug - Part 4A: Inspecting and Troubleshooting CSS
Firebug - Part 4B: Inspecting and Troubleshooting CSS
Firebug - Part 5: Inspecting the Box Model
Firebug - Part 6: HTTP Requests and Download Speeds
Firebug - Part 7a: The Script Tab (Basics)
Firebug - Part 7b: Debuggger, Breakpoint & Expression Watching
Firebug - Part 7c: Debugging JavaScript with the Firebug Console

HTML5 Canvas - Part 5: Image Scaling and Cropping
Reader Level:

Description: The upcoming HTML 5 specification promises to add support for a wide range of new and exciting web technologies. In this series we're going to focus on one of the major new players, the Canvas element, which allows for direct rendering and manipulation of vectors and images from within JavaScript.

Today we're going to continue our exploration of images by looking at how we can scale and crop them on canvas elements.

The HTML5 Canvas Series
HTML5 Canvas - Part 1: Introduction
HTML5 Canvas - Part 2: Basic
HTML5 Canvas - Part 3: Advanced Drawing Techniques
HTML5 Canvas - Part 4: Images
HTML5 Canvas - Part 5: Image Scaling and Croping

HTML5 Canvas - Part 4: Images
Reader Level:

The upcoming HTML 5 specification promises to add support for a wide range of new and exciting web technologies. In this series we're going to focus on one of the major new players, the Canvas element, which allows for direct rendering and manipulation of vectors and images from within JavaScript.

Today we're going to begin exploring the use of images within Canvas elements.

The HTML5 Canvas Series
HTML5 Canvas - Part 1: Introduction
HTML5 Canvas - Part 2: Basic
HTML5 Canvas - Part 3: Advanced Drawing Techniques
HTML5 Canvas - Part 4: Images
HTML5 Canvas - Part 5: Image Scaling and Croping Coming Soon

HTML5 Canvas - Part 3: Advanced Drawing Techniques
Reader Level:

The upcoming HTML 5 specification promises to add support for a wide range of new and exciting web technologies. In this series we're going to focus on one of the major new players, the Canvas element, which allows for direct rendering and manipulation of vectors and images from within JavaScript.

Today we're going to delve deeper into Canvas drawing by exploring custom paths and the methods that can be used to create them.

The HTML5 Canvas Series
HTML5 Canvas - Part 1: Introduction
HTML5 Canvas - Part 2: Basic
HTML5 Canvas - Part 3: Advanced Drawing Techniques
HTML5 Canvas - Part 4: Images
HTML5 Canvas - Part 5: Image Scaling and Croping Coming Soon

Show-Hide Passwords
Reader Level:

Entering passwords sometimes can be frustrating since you can't see what you're typing. This quick JavaScript will make it possible for visitors to toggle between text and the password protected field for their password entry.

HTML5 Canvas - Part 2: Basic
Reader Level:

The upcoming HTML 5 specification promises to add support for a wide range of new and exciting web technologies. In this series we're going to focus on one of the major new players, the Canvas element, which allows for direct rendering and manipulation of vectors and images from within JavaScript.

Today we're going to continue our exploration of the Canvas element by looking at the fundamental concepts of the drawing plane, along with some basic drawing tools.

The HTML5 Canvas Series
HTML5 Canvas - Part 1: Introduction
HTML5 Canvas - Part 2: Basic
HTML5 Canvas - Part 3: Advanced Drawing Techniques
HTML5 Canvas - Part 4: Images
HTML5 Canvas - Part 5: Image Scaling and Croping Coming Soon

HTML5 Canvas - Part 1: Introduction
Reader Level:

The upcoming HTML 5 specification promises to add support for a wide range of new and exciting web technologies. In this series we're going to focus on one of the major new players, the Canvas element, which allows for direct rendering and manipulation of vectors and images from within JavaScript.

In this first article, we'll explore what Canvas is, why it's important to us, and get a first quick look at how it can be used.

The HTML5 Canvas Series
HTML5 Canvas - Part 1: Introduction
HTML5 Canvas - Part 2: Basic
HTML5 Canvas - Part 3: Advanced Drawing Techniques
HTML5 Canvas - Part 4: Images
HTML5 Canvas - Part 5: Image Scaling and Croping Coming Soon

jQuery Plugins: Uniform
Reader Level:

While jQuery is a powerful JavaScript toolkit, there are still many things that it just doesn't accomplish right out of the box. Unlike most other solutions though, the jQuery framework is designed to be extensible through user definable plugins, meaning that almost any time you run into a scenario where jQuery can't natively solve your problem, chances are you'll be able to find a plugin that somebody else has created to take care of things for you!

In this collection of articles, we're going to focus on some of these plugins to see just how easy they are to use and how powerful they can be.

Today we're going to take a look at the Uniform plugin, which allows you to create customized form elements (select boxes, checkboxes and radios) that are not ordinarily customizable through CSS.

The jQuery Plugins Series:
jQuery Plugins: Uniform
jQuery Plugins: Image Cube
jQuery Plugins: Input Limiter

jQuery Quickshots - Summarizing Form Data: Part 3
Reader Level:

jQuery is a great tool for helping to make your JavaScript and AJAX applications easier to develop and maintain. One of the hardest things about it though, is that it introduces so many new and amazing possibilities that aren't always clearly obvious on the surface.

These "quickshot" articles are intended to act as hints, or inspirations, to some of the more creative or unknown problems that jQuery can help you tackle.

In this article, the third part of the previous "jQuery Quickshots - Summarizing Form Data" series, we're going to take our form summary to the next level by providing the user with inline editing capabilities.

The jQuery Summarazing Form Data Series:
jQuery Quickshots - Summarizing Form Data: Part 1
jQuery Quickshots - Summarizing Form Data: Part 2
jQuery Quickshots - Summarizing Form Data: Part 3

jQuery Quickshots - Summarizing Form Data: Part 2
Reader Level:

jQuery is a great tool for helping to make your JavaScript and AJAX applications easier to develop and maintain. One of the hardest things about it though, is that it introduces so many new and amazing possibilities that aren't always clearly obvious on the surface.

These "quickshot" articles are intended to act as hints, or inspirations, to some of the more creative or unknown problems that jQuery can help you tackle.

In this article, a follow-up to the previous "jQuery Quickshots - Summarizing Form Data: Part 1", we're going to expand on the idea of form summarization to point out errors to users in the summary and clean up some of the problems from last time.

The jQuery Summarazing Form Data Series:
jQuery Quickshots - Summarizing Form Data: Part 1
jQuery Quickshots - Summarizing Form Data: Part 2
jQuery Quickshots - Summarizing Form Data: Part 3

jQuery Quickshots - Summarizing Form Data: Part 1
Reader Level:

jQuery is a great tool for helping to make your JavaScript and AJAX applications easier to develop and maintain. One of the hardest things about it though, is that it introduces so many new and amazing possibilities that aren't always clearly obvious on the surface.

These "quickshot" articles are intended to act as hints, or inspirations, to some of the more creative or unknown problems that jQuery can help you tackle. Today we're going to look at a neat approach to summarizing form data so the user can review it before actually submitting.

The jQuery Summarazing Form Data Series:
jQuery Quickshots - Summarizing Form Data: Part 1
jQuery Quickshots - Summarizing Form Data: Part 2
jQuery Quickshots - Summarizing Form Data: Part 3

Appcelerator Entourage - Part 1: An Overview
Reader Level:

This is the first article in an on-going series about building rich internet applications with Appcelerator Entourage. Appcelerator Entourage is a framework combining client-side JavaScript libraries with server-side service brokers to create fully-integrated applications on a variety of server technologies, ranging from PHP to Rails to .Net.

Entourage was previously known as the Appcelerator SDK, but with its upgrade to Version 3 in later March 2009 not only was the name changed to Entourage but some fundamental redesign of the framework took place as well.

The Appcelerator Entourage Series:
Appcelerator Entourage - Part 1: An Overview
Appcelerator Entourage - Part 2: Getting Started
Appcelerator Entourage - Part 3: The Message Queue
Appcelerator Entourage - Part 4: Expressions
Appcelerator Entourage - Part 5: Expression Conditions

jQuery Quickshots - Submitting Forms with AJAX
Reader Level:

jQuery is a great tool for helping to make your JavaScript and AJAX applications easier to develop and maintain. One of the hardest things about it though is that it introduces so many new and amazing possibilities that aren't always clearly obvious on the surface.

These "quickshot" articles are intended to act as hints, or inspirations, to some of the more creative or unknown problems that jQuery can help you tackle. Today's article focuses on how to quickly and easily submit form data using jQuery's AJAX methods.

jQuery Quickshots - AJAX with JSON
Reader Level:

jQuery is a great tool in helping to make your JavaScript and AJAX applications easier to develop and maintain. One of the hardest things about it though is that it introduces so many new and amazing possibilities that aren't always clearly obvious on the surface.

These "quickshot" articles are intended to act as hints, or inspirations, to some of the more creative or unknown problems that jQuery can help you tackle. Today's article focuses on JSON, the compact alternative to XML for data exchanges between the client and server in AJAX scenarios.

AJAX Concept Quickshot - Password Protected Apps
Reader Level:

Making the change from traditional web development to AJAX requires more than just learning different sets of technologies: you also have to learn new ways of dealing with old problems. Today we're going to look at one of the classic examples of this: password protected web sites.

Creating a Nice Help Feature for Your Forms
Reader Level:

Some forms just need extra help. Maybe it is a complex form or the typical visitors to the form aren't familiar with entering information in a form and it just needs a little more context help when the visitor is at the field. You could put the help text on the page, but that could clutter up the page and make it unfriendly. This method will put the help on the page when it is needed and take it away as soon as it isn't. Just a few lines of JavaScript to get it all working...

The jQuery UI Components - Part 15: UI Effects II
Reader Level:

The jQuery library goes a long way to help make AJAX-oriented applications easier to develop and deploy. One of the things that makes jQuery stand out from the other libraries available though is its expandability. The jQuery UI plugins, built on top of the original jQuery library, take that original ease of development and expand it to apply to interactive interface components, rather than just the underlying code that drives them.

In this series, we're going to look at the various modules and components that make up the jQuery UI system to see how they can help to make building rich interfaces on top of our existing jQuery systems a piece of cake.

In the fifteenth part of this series we'll wrap up our look at the visual effects module provided by the jQuery UI.

The jQuery UI Components Series:
The jQuery UI Components - Part 1: Introduction
The jQuery UI Components - Part 2: Draggables
The jQuery UI Components - Part 3: Droppables
The jQuery UI Components - Part 4: Sortables
The jQuery UI Components - Part 5: Resizables
The jQuery UI Components - Part 6: Accordion Widget
The jQuery UI Components - Part 7: Datepicker Widget
The jQuery UI Components - Part 8: Colorpicker Widget
The jQuery UI Components - Part 9: Magnifier Widget
The jQuery UI Components - Part 10: Progress Bar Widget
The jQuery UI Components - Part 11: Slider Widget
The jQuery UI Components - Part 12: Tabs Widget
The jQuery UI Components - Part 13: UI Themes
The jQuery UI Components - Part 14: UI Core Effects
The jQuery UI Components - Part 15: UI Effects II

The jQuery UI Components - Part 14: UI Core Effects
Reader Level:

The jQuery library goes a long way to help make AJAX-oriented applications easier to develop and deploy. One of the things that makes jQuery stand out from the other libraries available though is its expandibility. The jQuery UI plugins, built on top of the original jQuery library, take that original ease of development and expand it to apply to interactive interface components, rather than just the underlying code that drives them.

In this series, we're going to look at the various modules and components that make up the jQuery UI system to see how they can help to make building rich interfaces on top of our existing jQuery systems a piece of cake.

In the fourteenth part of this series we'll spend some time looking at the last part of the jQuery UI system: the visual effects module.

The jQuery UI Components Series:
The jQuery UI Components - Part 1: Introduction
The jQuery UI Components - Part 2: Draggables
The jQuery UI Components - Part 3: Droppables
The jQuery UI Components - Part 4: Sortables
The jQuery UI Components - Part 5: Resizables
The jQuery UI Components - Part 6: Accordion Widget
The jQuery UI Components - Part 7: Datepicker Widget
The jQuery UI Components - Part 8: Colorpicker Widget
The jQuery UI Components - Part 9: Magnifier Widget
The jQuery UI Components - Part 10: Progress Bar Widget
The jQuery UI Components - Part 11: Slider Widget
The jQuery UI Components - Part 12: Tabs Widget
The jQuery UI Components - Part 13: UI Themes
The jQuery UI Components - Part 14: UI Core Effects
The jQuery UI Components - Part 15: UI Effects II

The jQuery UI Components - Part 13: UI Themes
Reader Level:

The jQuery library goes a long way to help make AJAX-oriented applications easier to develop and deploy. One of the things that makes jQuery stand out from the other libraries available though is its expandibility. The jQuery UI plugins, built on top of the original jQuery library, take that original ease of development and expand it to apply to interactive interface components, rather than just the underlying code that drives them.

In this series, we're going to look at the various modules and components that make up the jQuery UI system to see how they can help to make building rich interfaces on top of our existing jQuery systems a piece of cake.

In the thirteenth part of this series we'll finish up our look at the UI library system by exploring the concept of UI themes along with the JQuery UI Themebuilder application.

The jQuery UI Components Series:
The jQuery UI Components - Part 1: Introduction
The jQuery UI Components - Part 2: Draggables
The jQuery UI Components - Part 3: Droppables
The jQuery UI Components - Part 4: Sortables
The jQuery UI Components - Part 5: Resizables
The jQuery UI Components - Part 6: Accordion Widget
The jQuery UI Components - Part 7: Datepicker Widget
The jQuery UI Components - Part 8: Colorpicker Widget
The jQuery UI Components - Part 9: Magnifier Widget
The jQuery UI Components - Part 10: Progress Bar Widget
The jQuery UI Components - Part 11: Slider Widget
The jQuery UI Components - Part 12: Tabs Widget
The jQuery UI Components - Part 13: UI Themes
The jQuery UI Components - Part 14: UI Core Effects
The jQuery UI Components - Part 15: UI Effects II

The jQuery UI Components - Part 12: Tabs Widget
Reader Level:

The jQuery library goes a long way to help make AJAX-oriented applications easier to develop and deploy. One of the things that makes jQuery stand out from the other libraries available though is its expandibility. The jQuery UI plugins, built on top of the original jQuery library, take that original ease of development and expand it to apply to interactive interface components, rather than just the underlying code that drives them.

In this series, we're going to look at the various modules and components that make up the jQuery UI system to see how they can help to make building rich interfaces on top of our existing jQuery systems a piece of cake.

In the twelth part of this series we'll continue looking at the various jQuery UI Widgets that are available by examining the Tabs module.

The jQuery UI Components Series:
The jQuery UI Components - Part 1: Introduction
The jQuery UI Components - Part 2: Draggables
The jQuery UI Components - Part 3: Droppables
The jQuery UI Components - Part 4: Sortables
The jQuery UI Components - Part 5: Resizables
The jQuery UI Components - Part 6: Accordion Widget
The jQuery UI Components - Part 7: Datepicker Widget
The jQuery UI Components - Part 8: Colorpicker Widget
The jQuery UI Components - Part 9: Magnifier Widget
The jQuery UI Components - Part 10: Progress Bar Widget
The jQuery UI Components - Part 11: Slider Widget
The jQuery UI Components - Part 12: Tabs Widget
The jQuery UI Components - Part 13: UI Themes
The jQuery UI Components - Part 14: UI Core Effects
The jQuery UI Components - Part 15: UI Effects II

The jQuery UI Components - Part 11: Slider Widget
Reader Level:

The jQuery library goes a long way to help make AJAX-oriented applications easier to develop and deploy. One of the things that makes jQuery stand out from the other libraries available though is its expandibility. The jQuery UI plugins, built on top of the original jQuery library, take that original ease of development and expand it to apply to interactive interface components, rather than just the underlying code that drives them.

In this series, we're going to look at the various modules and components that make up the jQuery UI system to see how they can help to make building rich interfaces on top of our existing jQuery systems a piece of cake.

In the eleventh part of this series we'll continue looking at the various jQuery UI Widgets that are available by examining the Slider module.

The jQuery UI Components Series:
The jQuery UI Components - Part 1: Introduction
The jQuery UI Components - Part 2: Draggables
The jQuery UI Components - Part 3: Droppables
The jQuery UI Components - Part 4: Sortables
The jQuery UI Components - Part 5: Resizables
The jQuery UI Components - Part 6: Accordion Widget
The jQuery UI Components - Part 7: Datepicker Widget
The jQuery UI Components - Part 8: Colorpicker Widget
The jQuery UI Components - Part 9: Magnifier Widget
The jQuery UI Components - Part 10: Progress Bar Widget
The jQuery UI Components - Part 11: Slider Widget
The jQuery UI Components - Part 12: Tabs Widget
The jQuery UI Components - Part 13: UI Themes
The jQuery UI Components - Part 14: UI Core Effects
The jQuery UI Components - Part 15: UI Effects II

Hide Your Body!
Reader Level:

Sometimes, when you have a lot of tables with data on the screen, the information can be overwhelming. If we could create a way to hide table content that didn't completely hide the table and was easily accessed, that could make the page better for the visitor. Well - with a little JavaScript code and a properly setup table - this is a quick fix!

The jQuery UI Components - Part 10: Progress Bar Widget
Reader Level:

The jQuery library goes a long way to help make AJAX-oriented applications easier to develop and deploy. One of the things that makes jQuery stand out from the other libraries available though is its expandibility. The jQuery UI plugins, built on top of the original jQuery library, take that original ease of development and expand it to apply to interactive interface components, rather than just the underlying code that drives them.

In this series, we're going to look at the various modules and components that make up the jQuery UI system to see how they can help to make building rich interfaces on top of our existing jQuery systems a piece of cake.

In the tenth part of this series we'll continue looking at the various jQuery UI Widgets that are available by examining the Progress Bar module.

The jQuery UI Components Series:
The jQuery UI Components - Part 1: Introduction
The jQuery UI Components - Part 2: Draggables
The jQuery UI Components - Part 3: Droppables
The jQuery UI Components - Part 4: Sortables
The jQuery UI Components - Part 5: Resizables
The jQuery UI Components - Part 6: Accordion Widget
The jQuery UI Components - Part 7: Datepicker Widget
The jQuery UI Components - Part 8: Colorpicker Widget
The jQuery UI Components - Part 9: Magnifier Widget
The jQuery UI Components - Part 10: Progress Bar Widget
The jQuery UI Components - Part 11: Slider Widget
The jQuery UI Components - Part 12: Tabs Widget
The jQuery UI Components - Part 13: UI Themes
The jQuery UI Components - Part 14: UI Core Effects
The jQuery UI Components - Part 15: UI Effects II

Quick Shot: Alternate Table Row Coloring
Reader Level:

Do you have tables of data everywhere and you want to automatically setup the rows to alternate color?

This quick shot will use JavaScript and CSS to automatically alternate the background color of the table rows.

The jQuery UI Components - Part 9: Magnifier Widget
Reader Level:

The jQuery library goes a long way to help make AJAX-oriented applications easier to develop and deploy. One of the things that makes jQuery stand out from the other libraries available though is its expandibility. The jQuery UI plugins, built on top of the original jQuery library, take that original ease of development and expand it to apply to interactive interface components, rather than just the underlying code that drives them.

In this series we're going to look at the various modules and components that make up the jQuery UI system to see how they can help to make building rich interfaces on top of our existing jQuery systems a piece of cake.

In the ninth part of this series we'll continue looking at the various JQuery UI Widgets that are available by playing with the Magnifier module.

The jQuery UI Components Series:
The jQuery UI Components - Part 1: Introduction
The jQuery UI Components - Part 2: Draggables
The jQuery UI Components - Part 3: Droppables
The jQuery UI Components - Part 4: Sortables
The jQuery UI Components - Part 5: Resizables
The jQuery UI Components - Part 6: Accordion Widget
The jQuery UI Components - Part 7: Datepicker Widget
The jQuery UI Components - Part 8: Colorpicker Widget
The jQuery UI Components - Part 9: Magnifier Widget
The jQuery UI Components - Part 10: Progress Bar Widget
The jQuery UI Components - Part 11: Slider Widget
The jQuery UI Components - Part 12: Tabs Widget
The jQuery UI Components - Part 13: UI Themes
The jQuery UI Components - Part 14: UI Core Effects
The jQuery UI Components - Part 15: UI Effects II

The jQuery UI Components - Part 8: Colorpicker Widget
Reader Level:

The jQuery library goes a long way to help make AJAX-oriented applications easier to develop and deploy. One of the things that makes jQuery stand out from the other libraries available though is its expandibility. The jQuery UI plugins, built on top of the original jQuery library, take that original ease of development and expand it to apply to interactive interface components, rather than just the underlying code that drives them.

In this series we're going to look at the various modules and components that make up the jQuery UI system to see how they can help to make building rich interfaces on top of our existing jQuery systems a piece of cake.

In the eighth part of this series we'll continue looking at the various JQuery UI Widgets that are available by examining the Colorpicker module.

The jQuery UI Components Series:
The jQuery UI Components - Part 1: Introduction
The jQuery UI Components - Part 2: Draggables
The jQuery UI Components - Part 3: Droppables
The jQuery UI Components - Part 4: Sortables
The jQuery UI Components - Part 5: Resizables
The jQuery UI Components - Part 6: Accordion Widget
The jQuery UI Components - Part 7: Datepicker Widget
The jQuery UI Components - Part 8: Colorpicker Widget
The jQuery UI Components - Part 9: Magnifier Widget
The jQuery UI Components - Part 10: Progress Bar Widget
The jQuery UI Components - Part 11: Slider Widget
The jQuery UI Components - Part 12: Tabs Widget
The jQuery UI Components - Part 13: UI Themes
The jQuery UI Components - Part 14: UI Core Effects
The jQuery UI Components - Part 15: UI Effects II

The jQuery UI Components - Part 7: Datepicker Widget
Reader Level:

The jQuery library goes a long way to help make AJAX-oriented applications easier to develop and deploy. One of the things that makes jQuery stand out from the other libraries available though is its expandibility. The jQuery UI plugins, built on top of the original jQuery library, take that original ease of development and expand it to apply to interactive interface components, rather than just the underlying code that drives them.

In this series we're going to look at the various modules and components that make up the jQuery UI system to see how they can help to make building rich interfaces on top of our existing jQuery systems a piece of cake.

In the seventh part of this series we'll continue looking at the various JQuery UI Widgets that are available by spending some time with the Datepicker module.

The jQuery UI Components Series:
The jQuery UI Components - Part 1: Introduction
The jQuery UI Components - Part 2: Draggables
The jQuery UI Components - Part 3: Droppables
The jQuery UI Components - Part 4: Sortables
The jQuery UI Components - Part 5: Resizables
The jQuery UI Components - Part 6: Accordion Widget
The jQuery UI Components - Part 7: Datepicker Widget
The jQuery UI Components - Part 8: Colorpicker Widget
The jQuery UI Components - Part 9: Magnifier Widget
The jQuery UI Components - Part 10: Progress Bar Widget
The jQuery UI Components - Part 11: Slider Widget
The jQuery UI Components - Part 12: Tabs Widget
The jQuery UI Components - Part 13: UI Themes
The jQuery UI Components - Part 14: UI Core Effects
The jQuery UI Components - Part 15: UI Effects II

The jQuery UI Components - Part 6: Accordion Widget
Reader Level:

The jQuery library goes a long way to help make AJAX-oriented applications easier to develop and deploy. One of the things that makes jQuery stand out from the other libraries available though is its expandibility. The jQuery UI plugins, built on top of the original jQuery library, take that original ease of development and expand it to apply to interactive interface components, rather than just the underlying code that drives them.

In this series we're going to look at the various modules and components that make up the jQuery UI system to see how they can help to make building rich interfaces on top of our existing jQuery systems a piece of cake.

In the sixth installment of this series we'll begin to look at the various JQuery UI Widgets that are available by examining the Accordion module.

The jQuery UI Components Series:
The jQuery UI Components - Part 1: Introduction
The jQuery UI Components - Part 2: Draggables
The jQuery UI Components - Part 3: Droppables
The jQuery UI Components - Part 4: Sortables
The jQuery UI Components - Part 5: Resizables
The jQuery UI Components - Part 6: Accordion Widget
The jQuery UI Components - Part 7: Datepicker Widget
The jQuery UI Components - Part 8: Colorpicker Widget
The jQuery UI Components - Part 9: Magnifier Widget
The jQuery UI Components - Part 10: Progress Bar Widget
The jQuery UI Components - Part 11: Slider Widget
The jQuery UI Components - Part 12: Tabs Widget
The jQuery UI Components - Part 13: UI Themes
The jQuery UI Components - Part 14: UI Core Effects
The jQuery UI Components - Part 15: UI Effects II

The jQuery UI Components - Part 5: Resizables
Reader Level:

The jQuery library goes a long way to help make AJAX-oriented applications easier to develop and deploy. One of the things that makes jQuery stand out from the other libraries available though is its expandibility. The jQuery UI plugins, built on top of the original jQuery library, take that original ease of development and expand it to apply to interactive interface components, rather than just the underlying code that drives them.

In this series we're going to look at the various modules and components that make up the jQuery UI system to see how they can help to make building rich interfaces on top of our existing jQuery systems a piece of cake.

Today, in the fifth part of the series, we'll wrap up our explorations of the Core Interaction components by looking at the Resizables extension.

The jQuery UI Components Series:
The jQuery UI Components - Part 1: Introduction
The jQuery UI Components - Part 2: Draggables
The jQuery UI Components - Part 3: Droppables
The jQuery UI Components - Part 4: Sortables
The jQuery UI Components - Part 5: Resizables
The jQuery UI Components - Part 6: Accordion Widget
The jQuery UI Components - Part 7: Datepicker Widget
The jQuery UI Components - Part 8: Colorpicker Widget
The jQuery UI Components - Part 9: Magnifier Widget
The jQuery UI Components - Part 10: Progress Bar Widget
The jQuery UI Components - Part 11: Slider Widget
The jQuery UI Components - Part 12: Tabs Widget
The jQuery UI Components - Part 13: UI Themes
The jQuery UI Components - Part 14: UI Core Effects
The jQuery UI Components - Part 15: UI Effects II

ColdFusion and Spry: Part 1
Reader Level:

Spry is a JavaScript-based framework that provides AJAX-powered dynamic web content. There are other JavaScript libraries available to accomplish similar results. such a JSON, jQuery, etc. (On this CMX site, Rob Williams has a couple of series on jQuery and jQuery UI Components.)The Spry library is produced by Adobe Labs, and, as of this writing, is in 1.6.1 release. (SPRY at Adobe Labs.) Although SPRY can be used with other server technologies, such as PHP, ASP.net, etc., Spry seems to employ techniques that are especially intuitive to the ColdFusion developer.

Keith Dodd got into web development as a second career following 30 years in public education, with 19 as a middle school principal. With help from friends and a lot of reading, he got into ColdFusion (version 3) and in 2003 was certificated as an Advanced ColdFusion MX Developer. In recent years, he has worked with Flash and the integration of Flash with ColdFusion (with a lot of help from CMX resources). He is just starting to delve into Flex.

The ColdFusion and Spry Series:
ColdFusion and Spry: Part 1
ColdFusion and Spry: Part 2
ColdFusion and Spry: Part 3
ColdFusion and Spry: Part 4

The jQuery UI Components - Part 4: Sortables
Reader Level:

The jQuery library goes a long way to help make AJAX-oriented applications easier to develop and deploy. One of the things that makes jQuery stand out from the other libraries available though is its expandibility. The jQuery UI plugins, built on top of the original jQuery library, take that original ease of development and expand it to apply to interactive interface components, rather than just the underlying code that drives them.

In this series we're going to look at the various modules and components that make up the jQuery UI system to see how they can help to make building rich interfaces on top of our existing jQuery systems a piece of cake.

Today, in the fourth installment of the series, we'll continue our explorations of the Core Interaction components by looking at the Sortables extension.

The jQuery UI Components Series:
The jQuery UI Components - Part 1: Introduction
The jQuery UI Components - Part 2: Draggables
The jQuery UI Components - Part 3: Droppables
The jQuery UI Components - Part 4: Sortables
The jQuery UI Components - Part 5: Resizables
The jQuery UI Components - Part 6: Accordion Widget
The jQuery UI Components - Part 7: Datepicker Widget
The jQuery UI Components - Part 8: Colorpicker Widget
The jQuery UI Components - Part 9: Magnifier Widget
The jQuery UI Components - Part 10: Progress Bar Widget
The jQuery UI Components - Part 11: Slider Widget
The jQuery UI Components - Part 12: Tabs Widget
The jQuery UI Components - Part 13: UI Themes
The jQuery UI Components - Part 14: UI Core Effects
The jQuery UI Components - Part 15: UI Effects II

The jQuery UI Components - Part 3: Droppables
Reader Level:

The jQuery library goes a long way to help make AJAX-oriented applications easier to develop and deploy. One of the things that makes jQuery stand out from the other libraries available though is its expandibility. The jQuery UI plugins, built on top of the original jQuery library, take that original ease of development and expand it to apply to interactive interface components, rather than just the underlying code that drives them.

In this series we're going to look at the various modules and components that make up the jQuery UI system to see how they can help to make building rich interfaces on top of our existing jQuery systems a piece of cake. Today, in the third part of the series, we'll continue our explorations of the Core Interaction components by looking at the counterpart to last time's Draggable extension: the Droppable extension.

The jQuery UI Components Series:
The jQuery UI Components - Part 1: Introduction
The jQuery UI Components - Part 2: Draggables
The jQuery UI Components - Part 3: Droppables
The jQuery UI Components - Part 4: Sortables
The jQuery UI Components - Part 5: Resizables
The jQuery UI Components - Part 6: Accordion Widget
The jQuery UI Components - Part 7: Datepicker Widget
The jQuery UI Components - Part 8: Colorpicker Widget
The jQuery UI Components - Part 9: Magnifier Widget
The jQuery UI Components - Part 10: Progress Bar Widget
The jQuery UI Components - Part 11: Slider Widget
The jQuery UI Components - Part 12: Tabs Widget
The jQuery UI Components - Part 13: UI Themes
The jQuery UI Components - Part 14: UI Core Effects
The jQuery UI Components - Part 15: UI Effects II

The jQuery UI Components - Part 2: Draggables
Reader Level:

The jQuery library goes a long way to help make AJAX-oriented applications easier to develop and deploy. One of the things that makes jQuery stand out from the other libraries available though is its expandibility. The jQuery UI plugins, built on top of the original jQuery library, take that original ease of development and expand it to apply to interactive interface components, rather than just the underlying code that drives them.

In this series we're going to look at the various modules and components that make up the jQuery UI system to see how they can help to make building rich interfaces on top of our existing jQuery systems a piece of cake. Today, in the second part of the series we'll begin our explorations of the Core Interaction components by looking at the Draggable extension.

The jQuery UI Components Series:
The jQuery UI Components - Part 1: Introduction
The jQuery UI Components - Part 2: Draggables
The jQuery UI Components - Part 3: Droppables
The jQuery UI Components - Part 4: Sortables
The jQuery UI Components - Part 5: Resizables
The jQuery UI Components - Part 6: Accordion Widget
The jQuery UI Components - Part 7: Datepicker Widget
The jQuery UI Components - Part 8: Colorpicker Widget
The jQuery UI Components - Part 9: Magnifier Widget
The jQuery UI Components - Part 10: Progress Bar Widget
The jQuery UI Components - Part 11: Slider Widget
The jQuery UI Components - Part 12: Tabs Widget
The jQuery UI Components - Part 13: UI Themes
The jQuery UI Components - Part 14: UI Core Effects
The jQuery UI Components - Part 15: UI Effects II

The jQuery UI Components - Part 1: Introduction
Reader Level:

The jQuery library goes a long way to help make AJAX-oriented applications easier to develop and deploy. One of the things that makes jQuery stand out from the other libraries available though is it's expandibility. The jQuery UI plugins, built on top of the original jQuery library, take that original ease of development and expand it to apply to interactive interface components, rather than just the underlying code that drives them.

In this series we're going to look at the various modules and components that make up the jQuery UI system to see how they can help to make building rich interfaces on top of our existing jQuery systems a piece of cake. Today, in the first part of the series we'll do a quick review of jQuery's organizational structure, talk about what plugins and UI modules are, and explore just how easy they are to implement.

The jQuery UI Components Series:
The jQuery UI Components - Part 1: Introduction
The jQuery UI Components - Part 2: Draggables
The jQuery UI Components - Part 3: Droppables
The jQuery UI Components - Part 4: Sortables
The jQuery UI Components - Part 5: Resizables
The jQuery UI Components - Part 6: Accordion Widget
The jQuery UI Components - Part 7: Datepicker Widget
The jQuery UI Components - Part 8: Colorpicker Widget
The jQuery UI Components - Part 9: Magnifier Widget
The jQuery UI Components - Part 10: Progress Bar Widget
The jQuery UI Components - Part 11: Slider Widget
The jQuery UI Components - Part 12: Tabs Widget
The jQuery UI Components - Part 13: UI Themes
The jQuery UI Components - Part 14: UI Core Effects
The jQuery UI Components - Part 15: UI Effects II

Using JQuery - Part 11: AJAX (Cont.)
Reader Level:

Developing AJAX applications can often be more complicated than you initially expect. Although working through tutorials and learning about the code involved to do various tasks is beneficial in helping you develop new possibilities, the stark reality these days is that as you begin to develop more and more AJAX-based sites you'll end up becoming less and less enthusiastic about having to hand-write all of the basic AJAX functionality over and over again. This is where JavaScript Libraries come into play.

In this series we're going to take a look at one of the more interesting and widely used JavaScript AJAX library: jQuery.

In the eleventh part of this series we'll continue our look at JQuery's AJAX support by examining some of the more advanced AJAX methods.

The Using JQuery Series:
Using JQuery - Part 1: Introduction
Using JQuery - Part 2: The Basics
Using JQuery - Part 3: Selectors
Using JQuery - Part 4: DOM Manipulation
Using JQuery - Part 5: Advanced DOM Manipulation
Using JQuery - Part 6: Finishing up DOM Manipulation
Using JQuery - Part 7: Effects
Using JQuery - Part 8: Animation
Using JQuery - Part 9: Animation Queues
Using JQuery - Part 10: AJAX
Using JQuery - Part 11: AJAX (Cont.)

Using JQuery - Part 10: AJAX
Reader Level:

Developing AJAX applications can often be more complicated than you initially expect. Although working through tutorials and learning about the code involved to do various tasks is beneficial in helping you develop new possibilities, the stark reality these days is that as you begin to develop more and more AJAX-based sites you'll end up becoming less and less enthusiastic about having to hand-write all of the basic AJAX functionality over and over again. This is where JavaScript Libraries come into play.

In this series we're going to take a look at one of the more interesting and widely used JavaScript AJAX library: jQuery.

In the tenth part of this series we're going to explore JQuery's AJAX support.

The Using JQuery Series:
Using JQuery - Part 1: Introduction
Using JQuery - Part 2: The Basics
Using JQuery - Part 3: Selectors
Using JQuery - Part 4: DOM Manipulation
Using JQuery - Part 5: Advanced DOM Manipulation
Using JQuery - Part 6: Finishing up DOM Manipulation
Using JQuery - Part 7: Effects
Using JQuery - Part 8: Animation
Using JQuery - Part 9: Animation Queues
Using JQuery - Part 10: AJAX
Using JQuery - Part 11: AJAX (Cont.)

Using JQuery - Part 9: Animation Queues
Reader Level:

Developing AJAX applications can often be more complicated than you initially expect. Although working through tutorials and learning about the code involved to do various tasks is beneficial in helping you develop new possibilities, the stark reality these days is that as you begin to develop more and more AJAX-based sites you'll end up becoming less and less enthusiastic about having to hand-write all of the basic AJAX functionality over and over again. This is where JavaScript Libraries come into play.

In this series we're going to take a look at one of the more interesting and widely used JavaScript AJAX library: jQuery.

In the ninth part of this series we'll continue looking at animations by exploring JQuery's queuing system.

The Using JQuery Series:
Using JQuery - Part 1: Introduction
Using JQuery - Part 2: The Basics
Using JQuery - Part 3: Selectors
Using JQuery - Part 4: DOM Manipulation
Using JQuery - Part 5: Advanced DOM Manipulation
Using JQuery - Part 6: Finishing up DOM Manipulation
Using JQuery - Part 7: Effects
Using JQuery - Part 8: Animation
Using JQuery - Part 9: Animation Queues
Using JQuery - Part 10: AJAX
Using JQuery - Part 11: AJAX (Cont.)

Handling Browsers Without JavaScript Enabled
Reader Level:

While it's possible to construct sites based completely on JavaScript, often times the most common use for the language is to add or enhance the functionality of an existing site by making it more interactive. The prime example of this is the JavaScript based drop-down menu. Unfortunately one of the dangers of using JS-based drop downs is that if JavaScript is disabled (or the browser is not capable of it) then there is often no alternative way to navigate through your site! In this article we're going to look at this particular situation and examine one possible way to overcome it.

Using JQuery - Part 8: Animation
Reader Level:

Developing AJAX applications can often be more complicated than you initially expect. Although working through tutorials and learning about the code involved to do various tasks is beneficial in helping you develop new possibilities, the stark reality these days is that as you begin to develop more and more AJAX-based sites you'll end up becoming less and less enthusiastic about having to hand-write all of the basic AJAX functionality over and over again. This is where JavaScript Libraries come into play.

In this series we're going to take a look at one of the more interesting and widely used JavaScript AJAX library: jQuery.

In the eighth part of this series we're going to look at how we can use JQuery to create animations and sequenced effects.

The Using JQuery Series:
Using JQuery - Part 1: Introduction
Using JQuery - Part 2: The Basics
Using JQuery - Part 3: Selectors
Using JQuery - Part 4: DOM Manipulation
Using JQuery - Part 5: Advanced DOM Manipulation
Using JQuery - Part 6: Finishing up DOM Manipulation
Using JQuery - Part 7: Effects
Using JQuery - Part 8: Animation
Using JQuery - Part 9: Animation Queues
Using JQuery - Part 10: AJAX
Using JQuery - Part 11: AJAX (Cont.)

Using JQuery - Part 7: Effects
Reader Level:

Developing AJAX applications can often be more complicated than you initially expect. Although working through tutorials and learning about the code involved to do various tasks is beneficial in helping you develop new possibilites, the stark reality these days is that as you begin to develop more and more AJAX-based sites you'll end up becoming less and less enthusiastic about having to hand-write all of the basic AJAX functionality over and over again. This is where JavaScript Libraries come into play.

In this series we're going to take a look at one of the more interesting and widely used JavaScript AJAX library: jQuery.

In the seventh part of this series we're going to look at some of the neat visual effects jQuery provides for us.

The Using JQuery Series:
Using JQuery - Part 1: Introduction
Using JQuery - Part 2: The Basics
Using JQuery - Part 3: Selectors
Using JQuery - Part 4: DOM Manipulation
Using JQuery - Part 5: Advanced DOM Manipulation
Using JQuery - Part 6: Finishing up DOM Manipulation
Using JQuery - Part 7: Effects
Using JQuery - Part 8: Animation
Using JQuery - Part 9: Animation Queues
Using JQuery - Part 10: AJAX
Using JQuery - Part 11: AJAX (Cont.)

Using JQuery - Part 6: Finishing up DOM Manipulation
Reader Level:

Developing AJAX applications can often be more complicated than you initially expect. Although working through tutorials and learning about the code involved to do various tasks is beneficial in helping you develop new possibilites, the stark reality these days is that as you begin to develop more and more AJAX-based sites you'll end up becoming less and less enthusiastic about having to hand-write all of the basic AJAX functionality over and over again. This is where JavaScript Libraries come into play.

In this series we're going to take a look at one of the more interesting and widely used JavaScript AJAX library: jQuery.

In the sixth part of this series we're going to finish looking at how to manipulate elements with jQuery and DOM manipulation.

The Using JQuery Series:
Using JQuery - Part 1: Introduction
Using JQuery - Part 2: The Basics
Using JQuery - Part 3: Selectors
Using JQuery - Part 4: DOM Manipulation
Using JQuery - Part 5: Advanced DOM Manipulation
Using JQuery - Part 6: Finishing up DOM Manipulation
Using JQuery - Part 7: Effects
Using JQuery - Part 8: Animation
Using JQuery - Part 9: Animation Queues
Using JQuery - Part 10: AJAX
Using JQuery - Part 11: AJAX (Cont.)

Using JQuery - Part 5: Advanced DOM Manipulation
Reader Level:

Developing AJAX applications can often be more complicated than you initially expect. Although working through tutorials and learning about the code involved to do various tasks is beneficial in helping you develop new possibilites, the stark reality these days is that as you begin to develop more and more AJAX-based sites you'll end up becoming less and less enthusiastic about having to hand-write all of the basic AJAX functionality over and over again. This is where JavaScript Libraries come into play.

In this series we're going to take a look at one of the more interesting and widely used JavaScript AJAX library: jQuery.

In the fifth part of this series we're going to continue exploring how to manipulate elements with jQuery; this time around we'll be focusing on DOM manipulation.

The Using JQuery Series:
Using JQuery - Part 1: Introduction
Using JQuery - Part 2: The Basics
Using JQuery - Part 3: Selectors
Using JQuery - Part 4: DOM Manipulation
Using JQuery - Part 5: Advanced DOM Manipulation
Using JQuery - Part 6: Finishing up DOM Manipulation
Using JQuery - Part 7: Effects
Using JQuery - Part 8: Animation
Using JQuery - Part 9: Animation Queues
Using JQuery - Part 10: AJAX
Using JQuery - Part 11: AJAX (Cont.)

Using JQuery - Part 4: DOM Manipulation
Reader Level:

Developing AJAX applications can often be more complicated than you initially expect. Although working through tutorials and learning about the code involved to do various tasks is beneficial in helping you develop new possibilites, the stark reality these days is that as you begin to develop more and more AJAX-based sites you'll end up becoming less and less enthusiastic about having to hand-write all of the basic AJAX functionality over and over again. This is where JavaScript Libraries come into play. In this series we're going to take a look at one of the more interesting and widely used JavaScript AJAX library: jQuery.

In the fourth part of this series we're going to start to take a look at some of the ways that we can manipulate elements with jQuery.

The Using JQuery Series:
Using JQuery - Part 1: Introduction
Using JQuery - Part 2: The Basics
Using JQuery - Part 3: Selectors
Using JQuery - Part 4: DOM Manipulation
Using JQuery - Part 5: Advanced DOM Manipulation
Using JQuery - Part 6: Finishing up DOM Manipulation
Using JQuery - Part 7: Effects
Using JQuery - Part 8: Animation
Using JQuery - Part 9: Animation Queues
Using JQuery - Part 10: AJAX
Using JQuery - Part 11: AJAX (Cont.)

Highlight a Table Row on Mouseover!
Reader Level:

Highlighting a row in a table is a commonly seen web feature and is pretty handy for figuring out where you are in a larger table. Highlighting the row also allows the visitor to quickly see what data is connected to the row the mouse cursor happens to be over. While the effect is simple, the JavaScript is a little tricky. This tutorial will go over exactly how to implement this functionality on your tables!

Using JQuery - Part 3: Selectors
Reader Level:

Developing AJAX applications can often be more complicated than you initially expect. Although working through tutorials and learning about the code involved to do various tasks is beneficial in helping you develop new possibilites, the stark reality these days is that as you begin to develop more and more AJAX-based sites you'll end up becoming less and less enthusiastic about having to hand-write all of the basic AJAX functionality over and over again. This is where JavaScript Libraries come into play. In this series we're going to take a look at one of the more interesting and widely used JavaScript AJAX library: jQuery .

In the third part of this series we're going to continue exploring the many selectors that jQuery makes available to us.

The Using JQuery Series:
Using JQuery - Part 1: Introduction
Using JQuery - Part 2: The Basics
Using JQuery - Part 3: Selectors
Using JQuery - Part 4: DOM Manipulation
Using JQuery - Part 5: Advanced DOM Manipulation
Using JQuery - Part 6: Finishing up DOM Manipulation
Using JQuery - Part 7: Effects
Using JQuery - Part 8: Animation
Using JQuery - Part 9: Animation Queues
Using JQuery - Part 10: AJAX
Using JQuery - Part 11: AJAX (Cont.)

Simple Server-Side Form Validation
Reader Level:

Setting up a simple custom server-side form validation is a straightforward process and has the advantage over JavaScript in that it cannot be turned off by the user in order to override your validation.

In this tutorial, we will look at how we can use a combination of ColdFusion, JavaScript and CSS to provide an interactive form validating process. Although we do use a little JavaScript in this process it does not have a bearing on the validation process and is used only to enhance the messaging that is passed to the user.

Using JQuery - Part 2: The Basics
Reader Level:

Developing AJAX applications can often be more complicated than you initially expect. Although working through tutorials and learning about the code involved to do various tasks is beneficial in helping you develop new possibilites, the stark reality these days is that as you begin to develop more and more AJAX-based sites you'll end up becoming less and less enthusiastic about having to hand-write all of the basic AJAX functionality over and over again. This is where JavaScript Libraries come into play. In this series we're going to take a look at one of the more interesting and widely used JavaScript AJAX library: jQuery.

In the second part of this series we're going to talk about the modular setup of jQuery and what's required to begin to work with the core functionality of the library. We'll also write our first jQuery code and compare it to traditional DOM JavaScript to demonstrate how much more efficient jQuery can help you become.

The Using JQuery Series:
Using JQuery - Part 1: Introduction
Using JQuery - Part 2: The Basics
Using JQuery - Part 3: Selectors
Using JQuery - Part 4: DOM Manipulation
Using JQuery - Part 5: Advanced DOM Manipulation
Using JQuery - Part 6: Finishing up DOM Manipulation
Using JQuery - Part 7: Effects
Using JQuery - Part 8: Animation
Using JQuery - Part 9: Animation Queues
Using JQuery - Part 10: AJAX
Using JQuery - Part 11: AJAX (Cont.)

How to Make a Popup with a Translucent Background
Reader Level:

Displaying a larger image to a thumbnail can be accomplished many ways, in this article we will go over how to do it with apDIVs and a translucent background.

Using JQuery - Part 1: Introduction
Reader Level:

Developing AJAX applications can often be more complicated than you initially expect. Although working through tutorials and learning about the code involved to do various tasks is beneficial in helping you develop new possibilites, the stark reality these days is that as you begin to develop more and more AJAX-based sites you'll end up becoming less and less enthusiastic about having to hand-write all of the basic AJAX functionality over and over again. This is where JavaScript Libraries come into play. In this series we're going to take a look at one of the more interesting and widely used JavaScript AJAX library: jQuery.

In the first part of this series we're going to take a look at what libraries are, how they can help, and how to implement them. From there we'll also take a first glance at jQuery and examine some of the reasons that you may choose to use it as your library of choice.

The Using JQuery Series:
Using JQuery - Part 1: Introduction
Using JQuery - Part 2: The Basics
Using JQuery - Part 3: Selectors
Using JQuery - Part 4: DOM Manipulation
Using JQuery - Part 5: Advanced DOM Manipulation
Using JQuery - Part 6: Finishing up DOM Manipulation
Using JQuery - Part 7: Effects
Using JQuery - Part 8: Animation
Using JQuery - Part 9: Animation Queues
Using JQuery - Part 10: AJAX
Using JQuery - Part 11: AJAX (Cont.)

TODCon 9 Session - Better Scripting Through DOM JavaScript Coding
Reader Level:

Here is my PowerPoint presentation from the TODCon session on Better Scripting through DOM JavaScript coding. It will cover the reasons why DOM coding is good, go over libraries and why to do them and introduce (although not provide) several scripts that have been written to take advantage of the DOM scripting.

AJAX Dependent Selects!
Reader Level:

Ever wanted to have a select's content change on the fly? A little JavaScript, some AJAX, a pinch of server-side code and you can make a slick presentation for dependent selects.

On Page WYSIWYG Editing!
Reader Level:

Add this WYSIWYG editor and some JavaScript to your page and create a unique content management system that switches to edit content on your live web pages!

Only supports Internet Explorer for Windows and Firefox for Windows and Macintosh.

Random Backgrounds
Reader Level:

Ever need to create a random background for your web site? Perhaps a slideshow for your background? Well, this script will do just that for you and it is super easy to install!

Editable Select Lists Using CMX AutoComplete
Reader Level:

One of the most surprising aspects of HTML forms is that there is no way to natively create an editable select list. Developers are forced to either present a fixed value list for the user to choose from, or provide an additional text box to allow the user to enter a new value. Fortunately with a bit of help from the latest version of the CMX Auto Complete Extension we can finally solve this problem quite easily!

Good Behavior
Reader Level:

Learn to make a simple Dreamweaver Behavior.

JavaScript 202: Native Code
Reader Level:

In JavaScript 201 Paul Davis introduced the concept of a function and demonstrated how it could be used to make your code more managable and efficient. More importantly he also demonstrated how you could use a function to actually make JavaScript do something practical. This time around we're going to continue to build on that idea, but rather than creating our own functions all the time we're going to start exploring some of the functions that are included as part of the JavaScript language itself.

JavaScript 201: Functions
Reader Level:

Graduated from the JavaScript 101 articles and looking for more JavaScript to sink your teeth into? This article delves into the JavaScript functions. Learn about putting them together and making them do something.

Using Timeouts in JavaScript
Reader Level:

Web sites, like many technological devices these days, can often be regarded as having a "hurry up and wait" type of experience. That is, the user clicks a link, waits for the page to load, finally gets all of the relavent information and then takes their time going through the entire page until they find another link to follow, repeating the process once more. Unfortunately, this type of approach can be quite limiting for web developers, especially when trying to create a site where time and updated information can be critical to the overall experience.

In this article we'll take a look at some simple JavaScript that can give you the ability to keep the events and "action" on your web page going, even when the user is not following a link or refreshing the page.

JavaScript Dissecting - Automatic Shipping Address Code
Reader Level:

Dissecting a JavaScript function to find out how it does all the things it does! This article takes apart the JavaScript function from the Automatic Shipping Address article and details its inner most secrets.

Realtime Searching with CMX Table Sorter
Reader Level:

The CMX Table Sorter extension allows you to give your users the ability to sort any HTML table in both ascending and descending order in realtime, without the need to reload the page (or even the table) from the remote server. The latest version of this extension goes one step further though and allows you to perform realtime searches on tabular data, giving users the ability to reorganize the entire table to more quickly and effectively find what they're looking for. In this article we'll take a look at how this new "tabular search" feature works, and just how easy it is to implement on your own web pages.

Spell Checking HTML Forms with JavaScript and PHP
Reader Level:

Have you ever had to write a large amount of text into a field on an HTML form and been uncertain of just how reliable your spelling skills are? Wouldn't it be nice if HTML forms, like most other applications, had one of those handy little "Spell Check" buttons? In this article we'll look at how easy it is to implement this functionality using a PHP/JavaScript solution called Speller Pages.

AJAX Applied: PHP Contact Forms - Part 2
Reader Level:

In the first part of this article we explored how to take a standard PHP-driven contact form and convert it to an AJAX-driven one. Although the AJAX version was better than the original, the conversion over to client-side validation also opened the door for some new and unexpected possibilities.

In this article we're going to explore one of those new concepts and refine our form a bit further by adding form validation that occurs in real-time as the user completes each field.

The AJAX Applied Series:
AJAX Applied: PHP Contact Forms
AJAX Applied: PHP Contact Forms - Part 2

Batch Processing Images to a Custom File Size
Reader Level:

Fireworks Batch processing features can really save you time when you have to do the same thing to a bunch of images. A recent question in the Macromedia Fireworks forum made me stop to think of another batch processing routine that may come in handy for people; batch processing images to a specific file size.

Let's say you have a large number of photos that are different file sizes. Perhaps due to disc space restrictions or file size limitations for a web gallery or e-commerce site, you have to ensure that ALL the images not exceed a specific file size.

This tutorial will show you how to create a batch process for exporting a folder full of files to a specific file size, how to create your own custom Optimization Presets, and how to to save multiple Batch Options as a single script file that can be accessed in the Batch Process window.

AJAX Applied: PHP Contact Forms
Reader Level:

For most web developers AJAX is simply another one of those "buzz words" that represents a "revolutionary new technology" that will change the way web sites work forever. It all sounds fantastic and there are lots of great articles that explain what AJAX is and why you'd want to use it. The biggest problem for most developers is figuring out just how AJAX can be applied to real-world situations.

In this article we're going to try and tackle the implementation question. We'll take an existing PHP contact form and gradually convert it into an AJAX-driven solution. The goal is to demonstrate not only the technology and how it can be used, but also the process that you, as a developer, can take to begin the transition from traditional web development to AJAX-based pages and sites.

The AJAX Applied Series:
AJAX Applied: PHP Contact Forms
AJAX Applied: PHP Contact Forms - Part 2

Adding WYSIWYG to Textareas: Part 1
Reader Level:

One of the problems web developers encounter when allowing clients or users to insert content dynamically is ensuring that the outputted content still conforms to the standard of code required from a modern web site. The average site user knows little or nothing of HTML syntax, and certainly not enough to ensure that your precious pages still meet HTML syntax validation.

Many solutions have been created in order to solve this problem, BB style syntax is one of those; but the majority of users would probably prefer to be able to format their text as they would in a product like Microsoft Word. The generic word processor environment is something that's familiar to almost everyone who uses a personal computer. So, let's say we could actually allow people to insert data as clean HTML using a simple word processing interface, wouldn't that be cool? :) We can, and as a bonus we can easily implement it into a generic Dreamweaver "Insert Record" page.

CMX AJAX Form Submit Extension
Reader Level:

The CMX AJAX Form Submit Behavior for Dreamweaver and Dreamweaver MX 2004 allows you to use AJAX technology to submit form information to a server-side processing script and receive the results back without having to reload the page.

CMX AJAX Loader Extension
Reader Level:

The CMX AJAX Loader behavior allows you to dynamically load new XHTML/XML from your web server and insert it into any element on the current page without requiring the user to perform a full refresh. By eliminating full page refreshes you can improve both the performance of your site and the end user's experience. Now you can start enjoying the benefits of AJAX technology without having to worry about the complicated scripting that makes it work!

Using Related Fields with the CMX Auto Complete Extension
Reader Level:

The CMX Auto Complete Behavior makes adding basic "auto complete" functionality to your HTML forms fast and easy; when you begin to develop larger forms though you may be ready to start utilizing some of the more advanced features of the extension.

Note: This tutorial requires that you have the CMX Auto Complete Behavior installed on your system and are familiar with its use.

CMX Text Field Auto Complete Extension
Reader Level:

The CMX Auto Complete Behavior for Dreamweaver and Dreamweaver MX 2004 allows you to quickly and easily add fully customizable "auto complete" functionality (think Google Suggest) to any text or textarea input field on a web page. The "auto complete suggestions" box can easily be customized using CSS to integrate seamlessly into your page design and automatically sizes and positions itself for each input/textarea; no knowledge of JavaScript of the complexities of AJAX required!

Uploading Files with ASP.NET
Reader Level:

In this article you'll learn how to upload files to your web server using ASP.NET. Back in the old classic ASP days, this was a fairly difficult job. Not anymore!

Read on to learn how to upload one or multiple files, all files types or just certain kinds (based on the MIME type), and how to save the file using the original name or a user-specified name.

The code is presented in C# and VB.

The File Uploading with .NET Series:
File Uploading with ASP.NET
File Uploading in ASP.NET - Part 2
File Uploading with ASP.NET - Part 3

Dynamic CSS - CSS and the DOM
Reader Level:

The ability to control, update, and change CSS in realtime opens a whole world of new possibilities to web developers and the experiences that they can offer users. In the last part of this series we took a look at how we could use the Document Object Model and JavaScript to access and change CSS properties in realtime. Although we utilized the DOM to access those style properties though we really didn't get into the importance of the relationship between it and CSS. This time around we'll explore that important connection and see how a combination of the two technologies can be used to create stunning new possibilities.

The Dynamic CSS Series:
Dynamic CSS - Challenging Traditions
Dynamic CSS - Basic Real-Time Style Manipulation
Dynamic CSS - Real-Time Rule Changes
Dynamic CSS - CSS and the DOM

Dynamic CSS: Real-time Rule Changes
Reader Level:

The ability to give users the power to manipulate and control the styling of your site in real-time can change the way users experience and use your site forever. In this article we'll take a look at how to work with and change style sheet rules in real-time.

The Dynamic CSS Series:
Dynamic CSS - Challenging Traditions
Dynamic CSS - Basic Real-Time Style Manipulation
Dynamic CSS - Real-Time Rule Changes
Dynamic CSS - CSS and the DOM

Dynamic CSS - Basic Real-time Style Manipulation
Reader Level:

The ability to give users the power to manipulate and control the layouts and styling of your site in real-time can change the way users experience and use your site forever. In this article we'll take a look at the concepts behind real-time style manipulation and work through a basic example.

The Dynamic CSS Series:
Dynamic CSS - Challenging Traditions
Dynamic CSS - Basic Real-Time Style Manipulation
Dynamic CSS - Real-Time Rule Changes
Dynamic CSS - CSS and the DOM

Facilitating Multi-Site Development on Windows with IIS Admin
Reader Level:

The way that many folks develop sites with IIS on a non-server operating system, such as Windows XP Pro, is to create sub-folders off of the wwwroot folder where the default IIS web site points to, or to create virtual folders within IIS that point to a folder which contains all the files for your site. This is all fine and dandy when you're working with static sites, or if you use absolute or document relative URLs for yours links, images, scripts, and CSS. However, as you move toward larger, more complex sites with constant layouts throughout the site, you're probably using includes in some form to help decrease your maintenance time and effort. Whether it be to pull out your headers and footers, or to contain your user authentication code includes help you develop site quicker. When you're working with includes, many times you also have multiple levels of folders, and because of that, it is common to use root relative linking to images, CSS, Flash, and JavaScript files to make sure that paths are picked up correctly throughout the site, regardless of how deep the page is that calls in the include. This is where the sub-folder or virtual directory type of development can start to cause you problems.

Read on for an easy way to manage multiple sites with IIS Admin to avoid these problems.

DOM: Scripting to the Standard - Part 3
Reader Level:

The third part of this series focuses on how to change and manipulate a document using DOM methods and properties. We also explore how these techniques can be used by JavaScript's DOM implementation to add some real flexibility to your web pages without having to constantly force the user to wait for page reloads and server-side scripts.

The DOM: Scripting to the Standard Series:
DOM: Scripting to the Standards - Part 1
DOM: Scripting to the Standards - Part 2
DOM: Scripting to the Standards - Part 3

DOM: Scripting to the Standard - Part 2
Reader Level:

In the first part of this series we took a look at what the DOM standard was and how important it is to modern web development. This time around we take those concepts and begin to apply them to a practical application: browser-based scripting.

The DOM: Scripting to the Standard Series:
DOM: Scripting to the Standards - Part 1
DOM: Scripting to the Standards - Part 2
DOM: Scripting to the Standards - Part 3

DOM: Scripting to the Standard - Part 1
Reader Level:

Client-side website scripting lost many of its faithful supporters during the infamous "browser wars" when writing cross-browser compatible scripts became nearly impossible. Thanks to support for web standards though, those days are nearly gone. In this, the first part of this series, we'll take a look at the Document Object Model standard, how it affects web scripting, and how learning to work with it will benefit both you and your web-based projects.

The DOM: Scripting to the Standard Series:
DOM: Scripting to the Standards - Part 1
DOM: Scripting to the Standards - Part 2
DOM: Scripting to the Standards - Part 3

Adding a Sniplet Button to the JavaScript Eval Panel
Reader Level:

This tutorial is based on the original JavaScript Evaluation panel featured in at Community MX. The article serves three purposes. First, for the DW developer who uses JavaScript in web pages, you'll have a useful extension at the end of the article that allows you to test out pieces of JavaScript in a live panel. For DW extension developers, the extension allows access to the DW extension API in the panel. Finally, also for DW extension developers, the tutorial will show how to use the undocumented PopupMenu feature of the DW API to add dynamic menus to buttons easily.

Let it Snow, Man! - Part 2
Reader Level:

Well there's a chill in the air. The leaves have fallen, the wind is brisker and sometimes, even in early November, there's that "scent of snow" in the air. In the lead-up to the holiday season, I have created a two-part series that uses both Fireworks and Dreamweaver. The end result will be a fun little "build your own snowman" web page.

In Part 1, we used Fireworks to create all the essential ingredients for our frozen friend. We then exported the pieces using Export as CSS Layers. This gave us a starting html page (generated by Fireworks) and all our graphics, in absolutely positioned DW layers (divs).

In our second and final chapter we will work in Dreamweaver, using the Drag Layer behavior to create a web page where you can move all the snowman pieces together and build your own snowman online. The Drag Layer behavior makes use of Dynamic HTML (DHTML), to make your page interactive. In our case, we're letting the user move all the snowman pieces around to build their very own snowman, using a Drag-n-Drop method.

This concept could have many different uses: visual quizzing, jigsaw puzzles, or other holidays, just to name a few.

Note: The Safari browser does not support the Dreamweaver Drag Layer Behavior at this time.

Creating a Filter For the List Component
Reader Level:

In this tutorial, we create a filter for the Flash List component. As the user enters text into the TextInput component, the List component is filtered to display only those items that match the filter criteria.

This tutorial also explains how to port this functionality to JavaScript/HTML.

Communicating Between PHP and JavaScript
Reader Level:

One of the great mysteries of web coding seems to be trying to figure out how, if possible, you can pass information from a server-side scripting lanuage (PHP) to a client-side language (JavaScript); and even more elusively, how to pass information back again. In this article, we're going to solve the age old riddle and discover several possible solutions to the problem.

CMX Insert Shared JavaScript Extension
Reader Level:

When you're working within the Dreamweaver Configuration folder, there are quite a few JavaScript files that are useful for building extensions within the Shared folder. You may need to link to one or more of them in order to complete that fabulous extension that you're working on. Good news is that Dreamweaver makes it relatively easy to link to JavaScript files that are within the same site that you're working on (you do have a site defined for each of your Configuration folders on your system, right?). Unfortunately, the Shared JavaScript files can be located within multiple folders in several areas of your system. If you wanted to link from your HTML file within the user's config folder, but needed to link to a JavaScript file that comes standard with Dreamweaver, such as the ListControl class file, you'd then have to go traipsing around your hard drive to locate, and link to that JavaScript file. No more...

The Long and Short of Dreamweaver Timelines - An Introduction
Reader Level:

Built right into DW 4, MX and MX 04 (7.01), is the capability to do interactive animation, and more. This article will examine the Timeline feature, pros and cons, and how it works, by doing a few simple exercises. It will act as a launching point for future, more project-based tutorials.

The Benefits of Externalizing Fireworks Pop-up menu JavaScript
Reader Level:

Fireworks and Dreamweaver pop-up menus have their uses, in spite of all the critics. One nagging issue though, is that both DW and FW insist on dumping a hefty javascript function into EVERY page that makes use of the menu. This article shows you how to turn this internal js into an external file, and how to link it to the pages that need the pop up menu.

Tips For More Effective JavaScript Programming
Reader Level:

I'm a firm believer in the concept of continuing education. I honestly feel that there's always something more to learn about any given subject, even if you're an expert on that subject. That's why one of my favorite things to do is find ways of improving on something I'm already pretty good at. It's usually fun because I don't have to strain too hard to pick up new concepts (since I'm already familiar with the subject at hand), and it's always rewarding when you find yourself able to do something better than you could do it before.

That's why, even if you're an experienced JavaScript coder, I think you'll enjoy this article. Hopefully you'll learn something you didn't know before, or you'll better understand a concept or two that seemed difficult at first.

In this article, we're going to examine some ways that you can make your JavaScript code more effective.