View Full Version : Spry Menu Click Issue

07-01-2011, 03:21 PM
Hello, I 've been checking your answers for 3-4 weeks now, on the spry menu and I 've got 2 questions that it would really be appreciated if someone could answer...

Is it possible for the <.a href="#"> to be removed and not screw the way IE handles the menu?

Actually what I really want, is not having the site get "refreshed" if someone by accident clicks on a menu item with a sub-menu included.
and the second...

If someone clicks on a sub-menu item, I have a picture swap function on the onClick event, if he goes for another sub-menu item, the sub-menu closes down and he's forced to repeat the navigation to get to that sub-menu item. Google chrome handles the menu bar exactly the way I want it. If you wouldn't mind checking out the site (http://www.eletthes.gr) with an IE or a Firefox and then with Chrome u would understand what I'm saying, but I'm guessing you are already aware if this behavior.

Is there a way to replicate the way Chrome handles the menu bar in Firefox and IE?

Forgive me for the long post, I've been trying to get answers of the web with no luck so far.

07-01-2011, 05:01 PM
I'm not familiar with SPRY, but if it is insert <a href="#"> it si doing it wrong.
If it's not a link, it should not use <a>

07-02-2011, 06:02 AM
I wish it were so, if you remove even just the href="#", the menu doesn't work on IE, but the weird thing is, only the first 2 menus items dont work (if a menu item has a sub-menu, when you try to select an item from the sub-menu, the sub-menu disappears).
On firefox the menu behaves just like google chrome, but again only for the first 2 menu items. If I remove the <a></a> tags completely, same thing happens. So bottom line, it needs <a href="#"></a> to every item for the spry menu to even work, at least in the way it does.

07-03-2011, 12:29 AM
you have to have the link in a spry menu. You can try a javascript null link

a="javascript: void(0)"

Requires javascript but then so does the spry menu.

07-04-2011, 11:37 AM
Jim, I'm not familiar with spry, but can't you just replace <a> with something else?

07-04-2011, 12:59 PM
As far as I can see in SpryMenuBar.js you'll need an anchor tag to show the submenus. See var link.

// show and hide submenus
Spry.Widget.MenuBar.prototype.initialize = function(listitem, element) {
var opentime, closetime;
var link = listitem.getElementsByTagName('a')[0];
var submenus = listitem.getElementsByTagName('ul');
var menu = (submenus.length > 0 ? submenus[0] : null);

07-04-2011, 03:05 PM
My point was that in order to correct the markup, you could maybe replace it.

07-04-2011, 03:39 PM
Well, you'd have to add some styles and javascript for the replacement element to look/function properly. At which point, I'd probably recommend a jQuery solution i you're going to be doing that much work anyway.

07-04-2011, 04:19 PM
I also believe it's not worth the hassle while there are other JavaScript frameworks that do a much better job. Spry kind of sucks IMO... no graceful degradation, no nothing.

07-05-2011, 03:11 PM
i guess i could try jQuery...seeing that theres no easy way getting past this issue...thanks for the hassle of reply folks:)

07-05-2011, 03:21 PM
Did you try replacing the a href="#" with a href="javascript: void(0)"

(FYI, it looks like I left out the href part in my earlier comment.

07-05-2011, 03:47 PM
yes, i did just now, it fixed the "refresh" effect.
As far as the menu goes, same thing accors, the submenu closes after clicking. Also i took notice and at the bottom left i can see the link status being "javascript:void(0)", just to make sure it took the changes. Could it be something from the css code handling the clicking?
I'll keep the "javascript:void(0)" though, as it covers 1 of my 2 issues, thanks alot:)

07-05-2011, 07:29 PM
sorry, no solutions for that one

07-06-2011, 10:26 AM
Nevertheless, i appreciate the time you all took to provide solutions, thank you all