Creating an Interactive Jigsaw Puzzle with Fireworks and jQuery - Part 6: Grouping Pieces

By: Rob Williams on Friday, February 18, 2011
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.

Today we're going to add one of the most important enhancements yet: the ability to drag "snapped together pieces" around as groups. This will help make the puzzle more intuitive to use and more fun and friendly to solve.

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

Purchase this item
You can purchase this piece of content separately for $4.00

Want more?
Community MX members get unlimited access to daily articles, tutorials, extensions and support. The most comprehensive resource for Macromedia designers and developers today. Take a tour of what we offer, and discover the benefits of subscribing.

Already a member?
Simply log in using the form in the top right area of the site.