MAC OS X Style Menu Using JavaScript For WebSites

Mac OS X is know for the dock which has ‘fish-eye’ effect, whereby icons expand and contract as the mouse moves over them.This can be achieved in JavaScript using the Mac-style Dock.

It is compatible with most modern browsers, the compatible browsers are

  • Firefox 1.5 on Mac OS X
  • Firefox 2 on Ubuntu Linux
  • Firefox 2 on Windows (slightly jerky due to event handlers being given a higher priority than intervals)
  • Internet Explorer 6
  • Internet Explorer 7
  • Konqueror 3.5 on Ubuntu Linux
  • Opera 9 on Windows
  • Safari 2 on Mac OS X
  • Safari 3 on Windows


How to Install Mac OS X Style Menu

MacStyleDock.js9382 bytesFull version with comments
MacStyleDock.compressed.js2765 bytesCompressed version

But there are 2 usability issues

Firstly, the dock is generated entirely using JavaScript. If no alternative navigation is available then the site will be impossible to navigate for those without JavaScript.

Secondly, the dock item magnification, because the dock icons expand dynamically, they move on screen.

HomePage – Mac OS X StyleDock In JavaScript

Similar Post  FancyZoom - Zoom Into Images Using JavaScript

1 Comment

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.