Placed in: Home arrow Programming arrow mfDockMenu: A fisheye effect for your Joomla! menu viagra australia
viagra online
viagra sale
cialis online
cialis australia
mfDockMenu: A fisheye effect for your Joomla! menu

mfDockMenu If you're using a Mac or used one in the past, I'm pretty sure you'll know (and love) the dock menu. The fish eye (or fisheye) effect, zooming in and out the objects, is really cool.

I created a module for Joomla! 1.0.x and Joomla! 1.5 that allows you to add such a dock menu to your website. It's called mfDockMenu and can be used to increase the Web 2.0 value of your website and to give it some more eye-candy.

Get ready for a very cool menu on your website. Use mfDockMenu and impress your visitors with this beautiful menu.

The script is build on the great CSS Dock Menu from N.Design. I've added N.Design to my network page, since it's a good design blog. mfDockMenu also uses jQuery.

Demo Video of mfDockMenu

Install on Joomla! 1.0.x

  1. Log in to your back-end of the site
  2. Go to "Installers", "Modules"
  3. Click on "Browse" and navigate to the downloaded ZIP archive
  4. Press "Upload File & Install"
  5. Go to "Modules", "Site Modules"
  6. Search for mfDockMenu and edit it
  7. Set your parameters
  8. Save and publish the module

Install on Joomla! 1.5

  1. Log in to your back-end of the site
  2. Go to "Extensions", "Install/Uninstall"
  3. Click on "Browse" and navigate to the downloaded ZIP archive
  4. Press "Upload File & Install"
  5. Go to "Extensions", "Module Manager"
  6. Search for mfDockMenu and edit it
  7. Set your parameters
  8. Save and publish the module

How to use

Before you try out mfDockMenu, make sure you've added the following lines in the <head> section of your template. To do so, connect with your FTP and browse to your templates folder. Select your current template and edit the "index.php" file. Search for <head> and add the following lines direct after it:

<script type="text/javascript" src="modules/mod_mfdockmenu/js/jquery.js"></script>
<script type="text/javascript" src="modules/mod_mfdockmenu/js/interface.js"></script>
<link href="modules/mod_mfdockmenu/style.css" rel="stylesheet" type="text/css" />
<!--[if lt IE 7]>
<style type="text/css">
.dock img { behavior: url(modules/mod_mfdockmenu/iepngfix.htc) }
</style>
<![endif]-->

Now you're all ready to use your fisheye menu!

You can change all parameters in the module configuration.

Take note that the base URL of the images always is: modules/mod_mfdockmenu/images

Features

  • Up to 10 dock items
  • Comes standard with 10 beautiful icons from N.Design
  • Change maximum item width, proximity and more
  • Set the menu type to stick to the top or the bottom

Download

Attribution-Share Alike 3.0

Because of the use of jQuery, there is a possibility that the use of this module causes other plugins that are using JavaScript files conflict. Sadly, there is no way around this.

Feel free to give feedback about this module. Enjoy using it!


Tags:  module free joomla webdesign

Interested in this topic? You might enjoy another article I've written called

 
< Prev   Next >
Subscribe

Subscribe to Marcofolio