Create a Mac-like dock on web pages
This site (http://www.safalra.com/programming/javascript/mac-style-dock/) has a great tutorial on how to create a Mac-like dock on webpages using javascript. For those not familiar with the dock, it presents a row if images, and when you move the mouse over them, it grows the images near the mouse if a very smooth and stylish fashion cause a) it looks cool, and b) it makes it easier to click on the one you want. Here's what the dock looks like when it grows...
The dock, with the mouse cursor (not shown) over the key chain icon
Implementing this is really easy. The site offers the needed javascript file for inclusion. You then create an element to contain the dock and create a new dock object from the given javascript code. It works using two images for each icon; one image in the small state and one image in the large state. You give it all of the image details (file names, sizes, etc) which you create the javascript object. It's very easy to use.
The dock, with the mouse cursor (not shown) over the key chain icon
Implementing this is really easy. The site offers the needed javascript file for inclusion. You then create an element to contain the dock and create a new dock object from the given javascript code. It works using two images for each icon; one image in the small state and one image in the large state. You give it all of the image details (file names, sizes, etc) which you create the javascript object. It's very easy to use.
| Link: | www.safalra.com...Search for more tips related to this link |
| Rating: | 100% positive, 3 total Votes |
| Categories: | web 2.0 web design javascript tutorial |
| Added: | on Jul 13, 2007 at 11:39 am |
| Added By: | Marcos84 |
| Searches: | dock javascript web image create |

