Placed in: Home arrow Programming arrow mfDockMenu: A fisheye effect for your Joomla! menu
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

Comments
Add NewSearchRSS
Good web practices   2008-02-20 13:56:08
Gravatar image Just wanted to say that we're impressed with the number of extensions you've been producing recently for Joomla 1.5.

We actually included mfFancyZoom in our post "Essential Joomla 1.5 extensions" here:
http://www.goodwebpractices.com/joomla/joomla-1.5-extensions.html

Keep up the good work!

David
Reply | Quote
Houston - mfDockMenu Problem   2008-02-20 17:04:07
Gravatar image When I inserted the header code it left me with the showing at the top of my site.
Reply | Quote
Marco - Conflict?   2008-02-20 17:17:56
Gravatar image Like I said in the article:
Quote:
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.

Are you running any plugins using JavaScript?
Reply | Quote
Baltus - No demo on site?   2008-02-20 17:51:45
Gravatar image I just wonder why there is no live demo to be found on this or any other site?

Is there a place to see it in real life and not on a video?
Reply | Quote
Marco - Conflict   2008-02-20 18:23:31
Gravatar image Like I said in the article, some JavaScript files can conflict others. I use other plugins for this website, that don't work together with mfDockMenu.

You can see how it works over here:
CSS Dock Menu

Greetings,,
Reply | Quote
nathan - One More try...   2008-02-20 18:46:32
Gravatar image okay, obviously I can't submit that line of code on here...

what you need to do to fix the issue is look at the last line, just before the ending '>', delete the preceding '-' and replace it with '--'. Do NOT just add an extra '-', as the existing dash isn't a '-' but a special kind of dash.
Reply | Quote
Baltus - hmmm..   2008-02-20 19:14:45
Gravatar image It now works like a charm for me, but I seem to have lost some of the CSS for the rest of the joomla to work.

Its all just a vertical list(content etc)

I think this must be something with the insert of the code in index.php?

Because it came like this after the code was inserted.

Noe for the dash... I am currious about correkting my site.

Its a really beauty and I hope to build my site around this as a main navigation "thing"

Please clarify the "dash" issue.
Reply | Quote
Anonymous   2008-02-21 19:33:44
Gravatar image can you please explain it for beginner ?

I have tried everything, yes, there are javascripts in my website index.php page inside the tags, but it is right after the as it was suppose to be added in the help files,

All the icons just appear in front of each other on the 1st Icon's position, ( i can see Youtube linked icon only )

any fix for it ?
Reply | Quote
doctor   2008-02-21 13:00:48
Gravatar image code does not appeared :

anyways ..

--> or --> ( what is the difference ?
Reply | Quote
Marco - Check   2008-02-21 19:33:21
Gravatar image Could you provide me with an URL to your website, so I can check?
Reply | Quote
JD Mumma - Fix for stacked icons   2008-05-03 09:41:15
Gravatar image I too am having a "icons just appear in front of each other" problem and do not see a fix on this page or anywhere else on the net. Is there a solution?
Very COOL menu if I can get it to work!
Thanks
Reply | Quote
Seth - Stacked Icons here ...   2009-05-11 19:59:28
Gravatar image Had this working on one template from shape5.com, then tried to change to another template, and after installing and putting code in index.php head section, i have the icons all stacked on top of eachother in one ugly clump. Any fixes for this? lil help?
Reply | Quote
Baltus - Solved(almost)   2008-02-20 19:34:09
Gravatar image Its seems like you need to choose between adding the dash and getting the "site CSS" in order, but no mfDockMenu, or keeping the single dash and keep mfDockMenu, but loose the site CSS.

When I changed the dash to two dashes, it just went opposite. From not displaying site inn CSS order, to not displaing mfDockMenu. Now it just shows the video link and nothing more.

Any idea what went wrong for me?

Best regards

Baltus Norway
Reply | Quote
Marco - IE hack   2008-02-20 20:29:14
Gravatar image Possible problem could be the IE hack. I updated the "head" code (Big thanks nathan! Stupid MS Word...), please check above.

If it still doesn't work, please contact me through the contact form.

Greetings,,,
Reply | Quote
air - air   2008-02-21 00:44:35
Gravatar image y dont u use this extension on your website?? <img src=illy:' /> <img src=illy:' /> And it'll be more attractive if this ext release under GNU GPL licenses
Reply | Quote
Marco   2008-02-21 10:23:42
Gravatar image Hi,

I think I'm going to use this module in my next template.

The CC 3.0 license isn't that different from the GNU GPL. The only thing you have to do is mention my website name.

Greetings,,,
Reply | Quote
Goods - Getting an error   2008-02-29 18:31:38
Gravatar image Seems like an excellent module. however, I get "PCLZIP_ERR_BAD_FORMAT (-10)" when I try to install. Any help would be appreciated.
Reply | Quote
doctor - re: Getting an error   2008-02-29 18:59:29
Gravatar image
Goods wrote:
Seems like an excellent module. however, I get "PCLZIP_ERR_BAD_FORMAT (-10)" when I try to install. Any help would be appreciated.


I extract the zip on my local drive, and than compress it again with WINRAR (ZIP) Mode,

upload your own zip - it will work fine.
Reply | Quote
Goods - Thanks for the quck response..   2008-02-29 21:37:48
Gravatar image I tried already, but for a checksum error..
Reply | Quote
Goods - Never Mind... Got it   2008-02-29 21:42:09
Gravatar image Thanks a lot "doctor", I should have read your post more carefully.. I did try it again using Winrar in "ZIP" mode and it worked.. now to play around with it. Thanks.
Reply | Quote
outsidersthe - Moving Text URL Link   2008-03-02 20:23:26
Gravatar image Is there a possibility to move the text link to the top of the images, or another designated area. I have the images on top and the text appears on the bottom, which cannot be read because my body text is there. I don't want to have to give my menu are a larger width space.

Great module by the way, and many thanks.
Reply | Quote
Marco - Menu type   2008-03-03 09:11:56
Gravatar image You could try changing the menu type to "bottom". Now the text will appear on top.

Thanks for your feedback; Maybe I'll add more options in the next version.

Good luck.
Reply | Quote
theanimalix - Problem with manu layout   2008-03-29 17:04:32
Gravatar image Hello.

When I finally got the menu to wrok, without changing my css styles, I have next problem. The menu that is displayed is very low (i mean hight), so that the menu pictures arent displayed well. Even more, when I come close with mouse, the pictures move, but they move behind the menu backgground picture (dock-bg). Can anyone help me to solve this problem?

Thx and bye
Reply | Quote
lingualnyc - dockmenu not installing   2008-04-02 03:09:53
Gravatar image i tried several times...deleting installed files and reinstalling again but i get the same error when i try installing

Upload module - Upload Failed
Unrecoverable error "PCLZIP_ERR_BAD_FORMAT (-10)"
[ Continue ... ]
Upload module - Failed
Installation file not found:
[ Continue ... ]

any suggestions?
Reply | Quote
Marco - Unpack local   2008-04-02 11:46:33
Gravatar image Try to unpack the file on your local machine and re-pack again. Try again with the newly created .ZIP file.
Reply | Quote
Jay   2008-04-22 11:37:35
Gravatar image Very nice module. My website has a dark background and i found replacing the default background gif with a transparent one worked nicely.

Can i align the menu to the left somehow? Everything i have tried to alter in the style.css has resulted in chaos.
Reply | Quote
Jay -   2008-04-22 20:55:17
Gravatar image Got it .....

root/modules/mod_mfdockmenu/style.css

/* dock - top */
.dock {
margin-bottom: 70px;
position: absolute;
height: 50px;
text-align: center;
}
.dock-container {
left: 0;
height: 50px;
background: url(images/dock-bg2.gif);
padding-left: 20px;
}

a.dock-item {
display: block;
width: 40px;
color: #000;
position: absolute;
left: 0;
top: 0px;
text-align: center;
text-decoration: none;
font: bold 12px Arial, Helvetica, sans-serif;
}
Reply | Quote
Sam - When installing mf doc menu my site disappear   2008-04-27 23:26:37
Gravatar image Hi this is an urgent message,

After installing mf doc menu and published I couldn't see my site it does not appear anything.

Please help!!
Reply | Quote
deech - icons size in normal state   2008-04-29 13:19:41
Gravatar image very nice module!
Just a question... is there anyway to increase the size of the icons in the menu in the normal state?? I cant seem to get it. Maybe you can give a hint!

thanks

deech
Reply | Quote
Mokaro - IE give an error on page   2008-05-04 02:25:13
Gravatar image After I installed your great module I got this error. When I look into the problem I get the message row 1, char 1, This property is not supported by this object. (this is a free translate from Dutch :whistle: )
Everything is functioning OK. In mozilla looks everything ok. Can someone give me a suggestion what is wrong?
Reply | Quote
Jorge - Fix for stacked icons PLEASE   2008-05-05 12:09:28
Gravatar image Very good menu, but I can't get it to work. I have all icons in the same place, only visible the last one.
I don't know where to do the dash replacement (in the head section of the index.php???) I have changed it but nothing happens...
Please help me!
Reply | Quote
Lee T - MR   2008-05-19 08:50:24
Gravatar image Is it possible to orientate the icons verticaly instead of horizontally??? I can't see any thing in the options to let me do this.

Either way it's a very cool little toy! I was very impressed. Great work
Reply | Quote
Anonymous   2008-06-15 15:07:17
Gravatar image This mod is JUsT PERFECT !!!!!
but.... i have a problem...
it works only in frontpage , if i will go to another page the it shows only one icon (one behind the other)
Reply | Quote
Allos   2008-06-15 15:21:27
Gravatar image It works on all pages but it doesnt work in the video gallery page (seyret video component).!!

Does anyone knows what goes wrong ??!!
Reply | Quote
Rex Kramer - Maybe worth a look | Maybe worth a joomla port ;   2008-07-05 00:45:54
Gravatar image Maybe worth a look | Maybe worth a joomla port ;-)

http://eudock.jules.it/index-eudock2.0.php

TIA!
CU
Reply | Quote
Rex Kramer - Another alternative - MooTools based (not joomlafi   2008-07-05 00:52:10
Gravatar image Since you are using jQuery... and maybe some people have problems with scriptlibrary collisions...

i found this MOOTOOLS based fisheye concept:
http://zendold.lojcomm.com.br/ifisheye/

Maybe a future project for Marco ;-)
TIA!!!
Reply | Quote
rustyDusty - Unzipped, rezipped reinstall-still won't work   2008-07-14 21:07:42
Gravatar image :angry:
This module is the greatest. It looked good before I added the code to my template index.php page but now I have the same problem as everyone else: one icon at the top directing me to youtube.
Can't use it.
Anyone who has conquered this problem post your solution step by step ASAP.
Thanks.
Reply | Quote
Calvin Kim - re: Unzipped, rezipped reinstall-still won't work   2008-07-24 19:10:41
Gravatar image
rustyDusty wrote:
:angry:
This module is the greatest. It looked good before I added the code to my template index.php page but now I have the same problem as everyone else: one icon at the top directing me to youtube.
Can't use it.
Anyone who has conquered this problem post your solution step by step ASAP.
Thanks.


I had same problem.
You inserted *code* right after , right?
In fact, you have to insert them after .

It worked for me.
Reply | Quote
Calvin Kim - re: re: Unzipped, rezipped reinstall-still won't   2008-07-24 19:13:07
Gravatar image
Calvin Kim wrote:

I had same problem.
You inserted *code* right after , right?
In fact, you have to insert them after .

It worked for me.

I had same problem.
Code:
You inserted *code* right after , right?

In fact, you have to insert them after
.

It worked for me.
Reply | Quote
Calvin Kim - re: Unzipped, rezipped reinstall-still won't work   2008-07-24 19:17:55
Gravatar image
rustyDusty wrote:
:angry:
This module is the greatest. It looked good before I added the code to my template index.php page but now I have the same problem as everyone else: one icon at the top directing me to youtube.
Can't use it.
Anyone who has conquered this problem post your solution step by step ASAP.
Thanks.

Well, html code was filtered. :(
Insert code after following:
[code][/code]
Hope this will display as it is.
Reply | Quote
Calvin Kim - re: Unzipped, rezipped reinstall-still won't work   2008-07-24 19:19:36
Gravatar image
rustyDusty wrote:
:angry:
This module is the greatest. It looked good before I added the code to my template index.php page but now I have the same problem as everyone else: one icon at the top directing me to youtube.
Can't use it.
Anyone who has conquered this problem post your solution step by step ASAP.
Thanks.


Well,
you have to insert codes after
Code:
jdoc:include type="head"
Reply | Quote
Wick - No luck either   2008-07-27 13:52:14
Gravatar image Hi guys, im having no luck either with this BADASS looking module!
I have the same problem most of you guys seem to have ;
I only have the youtube icon ans link visable.

I read this 'solution'.. but I really dont get that one :0

Well,
you have to insert codes after
Code:
jdoc:include type="head"

where is this code???

Thanks alot.. It would be so great to get this component working in a few days before i launch my website!!
Reply | Quote
Cody - re: how to make it work on firefox 3?   2008-08-03 12:30:40
Gravatar image
Cody wrote:
This is amazing


thanks for this wonderful css dock menu
But how to make it work on firefox 3?

Thanks,
Cody
Reply | Quote
Rajesh - Menu Name should be displayed   2008-08-23 12:51:07
Gravatar image Very cool menu and i really liked very much..its working completly perfect...

Is there any way to show menu name displayed without mouse over?

Raj
Reply | Quote
Steven - Works on Joomla 1.5   2008-08-29 08:52:05
Gravatar image I finally got the module to work on Joomla 1.5
I also had the overlapping images, but the last forum entry did the trick.

Go to the index.php in the Joomla template you're using and inser the code after the following statement.
Reply | Quote
MARYSE - Red cross above images   2008-08-30 15:10:27
Gravatar image Hello, i don't understand why i have Red cross above images.Links are ok
thanks for the answer
Reply | Quote
Seb - How to fix it for firefox 3 ?   2008-08-31 22:16:39
Gravatar image Hi and thanks for your work...that's the best fisheye menu i tried, but it doesn't work with firefox 3... icons are one upon the others...

A solution ?
Reply | Quote
Werner - Problem   2008-09-12 23:10:53
Gravatar image Hello,
i read this 'solution'.. but I really dont get that one

Well,
you have to insert codes after
Code:
jdoc:include type="head"

where is this code???

Thanks alot.. It would be so great to get this component working in a few days before i launch my website!!
Reply | Quote
Siddan - Conflict with RokBox   2008-09-25 01:40:54
Gravatar image This is a great module, but unfortunately as like the other "fisheye" menus it conflicts with the plugin rokbox, which is an image/video displayer in an ajax popup window similiar to Lightbox... but nicer.

Obviously it is the JS file jquery that is causing it.
If anyone finds a solution to this then I would be much greatful
Reply | Quote
Sebastian valero - Help Please   2008-10-16 04:50:09
Gravatar image Hi, when i add the code to my template index.php the module doesnt fix the page, i mean that appears in the middle, im using joomla 1.5, thanks
Reply | Quote
Vampy - Hmm...   2008-10-31 19:35:53
Gravatar image Does this module have a problem with Joomla! Version 1.5.7 ??

All the menu items appear in the same spot!
Reply | Quote
Roelof - blue background on mouseover   2008-11-04 20:50:13
Gravatar image I have a funny problem with the Joomla 1.5 dockmenu: the mouseover generates a blue transparant background box behind the icon I'm pointing at. Looks to me like some kind of PNG background error. But it happens in Firefox 3 and also in IE7...

Is there some code I can change to make the blue box go away??
Reply | Quote
Roelof - oops   2008-11-04 20:58:10
Gravatar image Found my own answer :-) It was the template's CSS which contained a blue background for a:hover... :confused:
Reply | Quote
Pascal - Color   2008-11-13 21:43:53
Gravatar image I wanna use this module. It looks very good to me. But how can I change the colors of the text?
And can it be used vertical?? That would be very nice.

Looking forward to your reaction.

Thanks in advance,

Pascal
Reply | Quote
Roelof - Re: Color   2008-11-13 22:43:24
Gravatar image I think you can customize the link color in /modules/mod_mfdockmenu/style.css. Or just add it to your regular template CSS using class .dock-item. I don't think you can use it vertical.
Reply | Quote
Pascal - Re: Color   2008-11-14 09:08:15
Gravatar image I looked in the CSS and change the color, but nothing happens.
How can I use class .dock-item, can you explane??

It is also that IE7 and Firefox are giving different colors. What could this be?

Hope it will work, looking for an fine answer.

Pascal
Reply | Quote
Sergey   2008-11-22 18:20:13
Gravatar image Sorry bad English.
Please said how used mfDockMenu open link in new window?
Reply | Quote
Sergey   2008-11-26 18:16:59
Gravatar image Please, help!
Reply | Quote
Vitaliy Syromyatnikov   2008-12-01 09:45:17
Gravatar image My joomla website don't want to work with this module properly. Maybe it's some problem with Core Design Scriptegrator plugin?
Reply | Quote
Carlos - This is what I got   2008-12-02 17:26:10
Gravatar image Ok, I followed the instructions but I just can't get it to work,

this is the part of the index.php file that we weresupposed to edit:

" lang="">



[color=red]


[/color]




these are my results:

If the module is disabled it shows just big images of the menu, with no action.

With the mopdule enabled, no matter which position it just shows one small icon, the youtube one.

Please let me know what am I doing wrong.

Currently I am getting around it by puting my whole website in a wrapper html file, i put this code right underneat so the whole index.html code it looks like this:

[color=green]













Home
Contact
Portfolio
Music
Video
History
Calendar
Links
RSS
RSS2







$(document).ready(
function()
{
$('#dock').Fisheye(
{
maxWidth: 50,
items: 'a',
itemsText: 'span',
container: '.dock-container',
itemWidth: 40,
proximity: 90,
halign : 'center'
}
)
$('#dock2').Fisheye(
{
maxWidth: 60,
items: 'a',
itemsText: 'span',
container: '.dock-container2',
itemWidth: 40,
proximity: 80,
alignment : 'left',
valign: 'top',
halign : 'center'
}
)
}
);














This option will not work correctly. Unfortunately, your browser does not support inline frames.





[/color]

1.You will have to include the style.css file in the root directory.
2.create a folder named js with interface.js and jquery.js files in it.
3.Add the disired images to the image folder in the root directory or create one folder.

If you are unfamiliar with wrapping please ask me here or cgdavila@pinnaclebsi.com

Please if somebody got it working with Joomla, send screen shots.
Reply | Quote
Carlos   2008-12-02 17:33:26
Gravatar image hey everybody, i was trying to put instructions step by step and with the actual code but i guess the browser ignores and or interprets the code, sorry.
Reply | Quote
SoftwareCreatorz - Alignment problem   2008-12-22 10:06:57
Gravatar image :pinch:
Hey all,

I installed this module and It works great! The only problem I am having is the placement of it on my site. Take a look at softwarecreatorz.info. I would like to place it at the top Of the page. Can anyone explain how to move it. Basically i need to know how to move it anywhere, in case I want to change it later.

Thanks All
Reply | Quote
Harrie - Conflict with Core Design Scriptegrator plugin   2008-12-25 12:13:57
Gravatar image Very nice module, but ....

In FireFox 3.0.5 it conflicts with Core Design Scriptegrator plugin

Is there a solution??
Reply | Quote
Pascal - Space between icons   2008-12-28 20:02:25
Gravatar image How can I change the space between the icons??
Now al the icons are so close it don't look very nice.

Can anybody help?? Marco perhaps?

Thanks in advance,

Pascal
Reply | Quote
Alexx - Some problem   2008-12-29 18:48:08
Gravatar image Script conflict.
It owrk only when i`ve delete
in index.php /In other case it doesnt work((((
Reply | Quote
Alexx   2008-12-29 20:10:05
Gravatar image Conflict with mootools!!!
Reply | Quote
Gerard - Joomla admin problem   2009-01-07 22:47:42
Gravatar image Hi,

Tried installing and got it to work on a Joomla site. GREAT! But,.. when I take out Mootools (delete it frome Joomlas system, the Joomla (1.5) admin stops working (menus do not work) When I re-upload Mootools, mfdockmenu stops working. What can i do?

Thanks,
Gerard
Reply | Quote
estelle   2009-02-16 23:45:39
Gravatar image thanks a lot for the beautiful module!
if other dummies like me have the one icon youtube only appearing, and do not really understand the explanations above, it is really simple: i finally understood you juste have to enter the code given by Marco after

jdoc:include type="head"

and not before...

that's all, works like a charm now!
Reply | Quote
Alexx   2009-02-17 21:54:37
Gravatar image I try after and before but i have same result
Reply | Quote
Carlos - Finally works   2009-02-17 22:14:31
Gravatar image ok guys, thanks to estelle i was able to finnaly get it to work like it supposed to. i am so angry that i didnt read thoroughly, because this was posted before:

WRONG:


CORRECT:
jdoc:include type="head" PUT MARCO'S CODE HERE

there is another comment that it asks: where is this code?
jdoc:include type="head"

i think is a joomla code so if you cant find it (Ctrl + F) you might not be using joomla so you will have to add it to your index file (html or php, etc)
Reply | Quote
magoburicchio - ie error : proprieties or metod not supported by o   2009-03-13 23:27:08
Gravatar image hello guys i've installed mfdockmenu, it is wonderfull.. :D
but a problem on ie
it appears a yellow error bottom-left here:

http://magoburicchio.altervista.org/

proprieties or metod not supported by object

codes:0

row:1
car:1

i'm breaking my head on it.... thks in advance
Reply | Quote
Boron   2009-03-26 20:51:00
Gravatar image Great module, but I'm interesting can I disable the Text under icons?
Reply | Quote
Carlos - re:   2009-03-26 20:58:51
Gravatar image
Boron wrote:
Great module, but I'm interesting can I disable the Text under icons?


heck yeah, just go into the xml file and customize it.
Reply | Quote
sudhakar - How to DOCK it fixed in the joomla template   2009-04-03 06:27:03
Gravatar image How to DOCK it fixed in the joomla template?I tried to keep the menu at the footer position ,it worked fine.

Requirement for me is when I move the scroll bar,the menu should be docked at the botton of the screen.Can you please guide me,how to do it.
Reply | Quote
Max - link _"blank"   2009-04-15 02:45:27
Gravatar image Hi,
it works perfectly, but i'd like to know if I can set tag ..target="_blank".. to open a link in a new page.
Many Thanks

Max
Reply | Quote
jonathan rivera - proble with internet explorere   2009-04-24 12:07:42
Gravatar image it marks me this error
After I installed your great module I got this error. When I look into the problem I get the message row 1, char 1, This property is not supported by this object

and in IE 6 it doesn't look well i cant see the thumb nails
Reply | Quote
marco - Not compatible with chronoforms   2009-05-15 01:13:26
Gravatar image this is not compatible with chronoforms, the forms won't validate anymore
Reply | Quote
Shayna - finally works!   2009-06-11 19:29:17
Gravatar image
estelle wrote:
thanks a lot for the beautiful module!
if other dummies like me have the one icon youtube only appearing, and do not really understand the explanations above, it is really simple: i finally understood you juste have to enter the code given by Marco after

jdoc:include type="head"

and not before...

that's all, works like a charm now!



Thank you, estelle!!! i've read every single entry on this blog and yours is the ONLY one that worked.
Reply | Quote
IglooPunch - jQuery.noConflict() support   2009-06-16 21:02:40
Gravatar image I'm experiencing a conflict between mfdockmenu and my template. I had read that the jQuery calls have a noConflict option to avoid these scenarios and allow the variables called by jQuery to not be overwritten by the mootools variables which my template uses. Does anybody know how i would implement this in mfdockmenu, or if it's even supported? I found a few refernces to jQuery in the .js files, but when i changed them to jQuery.noConflict() i recieved error messages about improper syntax. If somebody could give me an example of how to change the calls it would be extremely helpful.

Also, this is the most gorgeus module i've ever seen for anything anywhere :lol: The other fisheyes menus are choppy, but mfdockmenu is smooth and elegant, i really want to keep using it.

Thanks
Reply | Quote
Anonymous - re: jQuery.noConflict() support   2009-06-19 03:04:21
Gravatar image
IglooPunch wrote:
I'm experiencing a conflict between mfdockmenu and my template. I had read that the jQuery calls have a noConflict option to avoid these scenarios and allow the variables called by jQuery to not be overwritten by the mootools variables which my template uses. Does anybody know how i would implement this in mfdockmenu, or if it's even supported? I found a few refernces to jQuery in the .js files, but when i changed them to jQuery.noConflict() i recieved error messages about improper syntax. If somebody could give me an example of how to change the calls it would be extremely helpful.

Also, this is the most gorgeus module i've ever seen for anything anywhere :lol: The other fisheyes menus are choppy, but mfdockmenu is smooth and elegant, i really want to keep using it.

Thanks


In case anybody's interested, the jquery.js file is prepackaged, so i got an upgraded version from the jquery web site. I then modified the mod_mfdockmenu.php file and changed
Code:
$(document).ready(
function()

to

jQuery(document.ready(
function($)


that worked fine. When i tried to implement noConflict it stopped working:
Code:
jQuery.noConflict(document).ready(
function($)


I also added jQuery to the dock.fisheye sections, which works fine until i add the noConflict.

If anybody knows that i should stop working on this please tell me :unsure:
Reply | Quote
carlos - text color   2009-06-21 22:13:53
Gravatar image How do I change the text color? y tried in the /mod_mfdockmenu/style.css but nothing happens.
Reply | Quote
Mr.Fuse - Conflicts   2009-07-30 14:18:59
Gravatar image :arrow: Carlos, for change text color it's in /mod_mfdockmenu/style.css, change the color attribut in there like this : "color: #555555"

:arrow: Everybody, for the conflict between javascript librarys, you must change, modules\mod_mfdockmenu\mod_mfdockmenu.php like this :

before:
Code:




	$(document).ready(

		function()

		{

			$j('#dock').Fisheye(

				{

					maxWidth: ,

					items: 'a',

					itemsText: 'span',

					container: '.dock-container',

					itemWidth: ,

					proximity: ,

					halign : 'center'

				}

			)

			$('#dock2').Fisheye(

				{

					maxWidth: ,

					items: 'a',

					itemsText: 'span',

					container: '.dock-container2',

					itemWidth: ,

					proximity: ,

					alignment : 'left',

					valign: 'bottom',

					halign : 'center'

				}

			)

		}

	);


after:
Code:




 var $j = jQuery.noConflict();

	$j(document).ready(

		function()

		{

			$j('#dock').Fisheye(

				{

					maxWidth: ,

					items: 'a',

					itemsText: 'span',

					container: '.dock-container',

					itemWidth: ,

					proximity: ,

					halign : 'center'

				}

			)

			$j('#dock2').Fisheye(

				{

					maxWidth: ,

					items: 'a',

					itemsText: 'span',

					container: '.dock-container2',

					itemWidth: ,

					proximity: ,

					alignment : 'left',

					valign: 'bottom',

					halign : 'center'

				}

			)

		}

	);


and that's it !!!

You can found explanations here :
http://docs.jquery.com/Using_jQuery_with_Other_Libraries

See you!

Dams[fr]
Reply | Quote
Sebastian Hill - Mr. Fuse - Thanks!   2010-03-21 22:28:42
Gravatar image Thanks Mr. Fuse,
this works perfectly for me! I'm combining mfDockMenu and Superfish menu on one page. This trick made it work.
Thanks,
SH

PS. Does anyone know how to apply the DockMenu in a vertical manner?
Reply | Quote
9nails   2009-08-10 01:09:13
Gravatar image still cant seem to get it to work with phoenix yootheme template...also i dont have the "head" i just have the "yoomodules" in my index.php, where should i add the code? I have tried adding the code in the section but the icons stack on top of each other.. please help , thanks
Reply | Quote
Mary - Second installation   2009-08-31 19:09:58
Gravatar image I installed this great menu-module vertically on the left side, and now I'd like to have a 2nd one below. Could anyone tell me how to do this?

Thank you very much,

Mary
Reply | Quote
Joe - Vertically ?   2010-01-09 17:54:30
Gravatar image How did you get it installed vertically? Does anyone know how to get it vertical, like for a left hand frame ?
Reply | Quote
Sebastian Hill - Really? Vertical!?   2010-03-21 22:31:53
Gravatar image Hi Mary,
did you really make this work vertically?
I'd appreciate if you could comment on how you did that!
Thanks,
SH
Reply | Quote
Taryn - white line error   2009-09-06 20:06:45
Gravatar image I've installed without editing anything and there a strange white line which moves top or bottom depending on which i select in the module, see it here http://rsahomes.co.za/ how would i remove this?
Reply | Quote
Elver Lego   2009-09-21 09:28:06
Gravatar image it didn't work for me in the first place. The problem I encounter is that I placed the code right after the instead right after the tag... Just sharing for those others that encounter problem that the vide player only appear. Thanks Marco
Reply | Quote
David Desautel - Desautel.net   2009-10-05 05:35:24
Gravatar image After reading the entire column of posts above, and making changes according to some of the suggestions above, I have this module almost working correctly. I have three of my own icons, and I am adding this module on the left at the top. I have my three icons appearing correctly, in the correct order, and with the fisheye effect. The only problem now is the the entire module box does not expand to hold the icons. The box is only one line high, and the icons hang over the box into the box below. The text links are not showing either. This problem came into being when I changed the root/modules/mod_mfdockmenu/style.css file as specified in Jay's post above on 2008-04-22 20:55:17.

Anyone know why this might be happening? How does the box size get controlled?

Thanks!
Dave
Reply | Quote
Boogy_totyo   2009-10-13 19:43:24
Gravatar image How could i integrate this module in joomla menu system ? My problem is that if i have an internal link (for example blog category) the page is not so ok and my parameters like leading, intro, etc is gone...
Could you help me with that ?
Reply | Quote
Boaz - Look at the link   2010-01-11 00:07:47
Gravatar image Look at you link
you should paste in the url of mfdmenu url like index.php?option=com_sobi2&Itemid=204 no need for http:///etc it will redirect to your site. :!:
Reply | Quote
SmallFeet - Homepage Images   2009-11-03 17:06:05
Gravatar image Do you know how I can put the media pack images on this page http://www.b2badvertising.info/
on a new row?
Reply | Quote
mar - space between   2009-12-14 01:30:04
Gravatar image Hai!!! :)

Is there any possibility to make the space between icons bigger?
Reply | Quote
Danilo Davin - Excellent product   2009-12-22 05:29:30
Gravatar image This is a really good resource! I am loving it.
Reply | Quote
Warren Diggles   2010-01-01 06:25:23
Gravatar image Here is a working version of the script on joomla! co-existing with Front Page Slideshow

http://www.warrendiggles.com/miraclesofhealth/

Link information also available on photography and marketing blog

NOTE:
This version does not work when javascript is turned off:

When javascript is turned off the icons are all on the left, on top of each other.

Front Page Slideshow does not work either, images do not display when javascript is turned off.
Reply | Quote
Warren Diggles - Photography and Design   2010-03-30 16:34:31
Gravatar image Wanted to update this post, the working version is now referenced on my blog - http://www.photographyandmarketing.com/a-day-in-the-life/mfdockmenu-fisheye-effect-joomla-live/

Warren
Reply | Quote
Boaz - Fantastico !!!   2010-01-11 00:03:42
Gravatar image :lol: Bless you my good man totally awesome piece of giveaway, I like it al ot.
Reply | Quote
Kak Abbas - Awesome!   2010-02-25 07:41:16
Gravatar image I just want to say.......this is AWESOME !!
Reply | Quote
kiran   2010-03-09 02:25:50
Gravatar image Hi, thanks for the module. I was able to install it successfully and use it, but I am not able to get the fisheye effect. All the icons are displayed in full size occupying so much space.
It did not work even after adding the following code, infact it made all my icons disappear and display only one small icon






Can you please help?
Reply | Quote
Mel - Multiple dock menu on the smae page ?   2010-04-14 16:41:53
Gravatar image Is it possible to put this dock menu several times on the same page ?

I tried doing this but the first one is working well, and the others only show the last icon.

Could you help ?

Thanks
Reply | Quote
Sebastian Hill - re: Multiple dock menu on the smae page ?   2010-04-14 22:51:14
Gravatar image
Mel wrote:
Is it possible to put this dock menu several times on the same page ?

I tried doing this but the first one is working well, and the others only show the last icon.

Could you help ?

Thanks


Yes, I made this work, without much problems really. The only thing I noticed is that the max width, item width, proximity parameters are identical for the 2 docks, despite having different parameter settings.
I had a similar problem where only the last icon was showing, but that was more due to a PHP/CSS error I had made. Can't quite recall what it was. You might want to look into that.
Hope this helps.
Reply | Quote
Mel - re: re: Multiple dock menu on the smae page ?   2010-04-16 10:32:16
Gravatar image
Sebastian Hill wrote:
Mel wrote:
Is it possible to put this dock menu several times on the same page ?

I tried doing this but the first one is working well, and the others only show the last icon.

Could you help ?

Thanks


Yes, I made this work, without much problems really. The only thing I noticed is that the max width, item width, proximity parameters are identical for the 2 docks, despite having different parameter settings.
I had a similar problem where only the last icon was showing, but that was more due to a PHP/CSS error I had made. Can't quite recall what it was. You might want to look into that.
Hope this helps.


Hi !

thanks for you're answer !

What was the problem with your PHP/CSS ?

Thanks
Reply | Quote
ahmadtamimi - conflict   2010-04-21 11:31:40
Gravatar image Hi all
it is a beautiful menu but when i add it,it seems that menu js files conflicts with other js files. <img src=hock:' />
is there any solution for this problem?
Reply | Quote
Camnio - going to try   2010-05-05 20:45:57
Gravatar image I'm going to try this module out.
Reply | Quote
Steve - No joy for me   2010-05-21 21:58:48
Gravatar image :angry:

It just displays all the icons large and does not do the fisheye effect, and javascript is enabled.
Reply | Quote
Martz - Fisheye doesn't work when i scroll down   2010-10-11 17:44:04
Gravatar image Fist of all let me say this module is great, very handy.

My problem is:

My dock menu is set at the bottom.

After installation I got a problem. When I scrolled down my site my dock menu stayed exactly at the beginning position, so I changed my default.css and added a fixed position to it. I solved that problem. So now when I scroll down or up it stays at the same place, at bottom.

But now the problem is that when I scroll down the fish eye effect doesn't work, it seems like a transparent div stays at the start position before the scroll bar is moved. So the image stays always at the bottom, but the hover area stays in other position.


Any idea how to fix this?

Thanks
Reply | Quote
hirmani80 - WebHostingPad   2011-08-02 09:28:36
Gravatar image I am very much thanks for visiting the nice info in this blog and the nice impression in this blog. I had really like it very much for using the great technology is visible in this blog. I am really very happy for visiting the nice impression in this blog. This is very happy for visiting the great info in this blog. Thanks a lot for sharing the nice info in this website.
Reply | Quote
Read more...
Name:
Email:
  Gravatar enabled.
Website:
Title:
UBBCode:
[b] [i] [u] [url] [quote] [code] [img] 
 
 
:angry::0:confused::cheer:B):evil::silly::dry::lol::kiss::D:pinch:
:(:shock::X:side::):P:unsure::woohoo::huh::whistle:;):s
:!::?::idea::arrow:
 
Security Image
Please input the anti-spam code that you can read in the image.
Unsubscribe from e-mail notifications.
 
< Prev   Next >
[ Back ]
Subscribe

Subscribe to Marcofolio