[SOLVED] problems with jquery menu

36 Posts

shickson Reply #1, 15 years, 10 months ago

I’m having problems using <BASE HREF /> with my drop down menu.

Basically the menu is setup using wayfinder correctly and the menu functions corectly. However taking the example below:

>HOME | link= "/index.php?=1"
>SERVICE | link= "/index.php?=2"
>SERVICE#1 | link= "#"
>Information | link= "/index.php?=4"
>Why | link= "/index.php?=5"
>SERVICE#2 | link= "/index.php?=6"

The problem i have is they all link to pages and are clickable. If you take a look at the resource SERVICE#1, this has a link href of ="#". The reason for this is that i have created it as a weblink and pointed it to "#" because i don’t want this as a page just a menu item that if clicked does nothing but yet stays with its children resource expanded on hover so they are clickable.

The problem i have is that in the source code it produces the correct code <a href="#"> but with <BASE HREF /> being declared in the header the link when clicked is replaced by "http:mydomain.co.uk/#". This means that the menu item SERVICE#1 once clicked, refreshes the page and contracts all the hovered children resources, rather than doing nothing and keeping the menu expanded.

SO in a nut shell i need it to ignore the base href on this one link, is there anyway i can do this, because if iremove BASE HREF the menu performs as i want??

Ideally i don;t want to have to remove base href and make sure all my paths are referenced absolute.....!

1,572 Posts

Paulp Reply #2, 15 years, 10 months ago

Take out the <BASE HREF /> from your header and just link everything relative from the root.

I’ve seen a few problems from the forums using anchors but have never experienced them myself as I don’t call the base url in my header ( don’t see the need for it ) and have developed a site that uses a lot of " #a, #b, #c" etc urls with no problem

36 Posts

shickson Reply #3, 15 years, 10 months ago

I can’t just remove the base href reference as i have a blog and multiple plugins that heavily rely on the base href..

All my anchors work perfectly within the site, however i just need the menu href="#" to be relative.

So rather than it using base and displaying the hyperlink as http://mydomain.com/# i need it to use relative to where in the website the visitor is. For example if the user is on the about us page and the drop down container is testimonials that they are clicking, it needs to take its current id and make the link something like http://mydomain.com/about-us/# so that the click is rendered useless as it doesnt click but allows the menu to drop down for the children resources to be clicked.

36 Posts

shickson Reply #4, 15 years, 10 months ago

Fixed with this simple jquery in the head:

<script type="text/javascript">
jQuery(document).ready(function() {
    jQuery("a[ href ^= '#' ]").each(function() {
        var href = window.location + jQuery(this).attr('href').replace('/#.*/i','');
        jQuery(this).attr('href',href);
    });
});
</script>