Need OnClick solution for Wordpress Custom Menue WordPress

snoffoz comments:

Hi Hai Bui,

But the child categories would still disappear once I click on them right? Like it does now on "Bureau"?
I would like for them to stay.

Hai Bui comments:

ok, then add .current-menu-parent:
li.current_page_item ul.sub-menu, li.current-menu-parent ul.sub-menu { display: block; visibility: visible; !important}

snoffoz comments:

Hi Hai Bui,

Just tried your solution but doesn't work on "Projecten", have a look.

http://wptemp.site90.net/

Hai Bui comments:

I'm sorry, my typo, it should be
li.current_menu_item ul.sub-menu, li.current-menu-parent ul.sub-menu { display: block; visibility: visible; !important}

snoffoz comments:

Still no dice

Hai Bui comments:

Really sorry, too many typos today... here's the correct one:
li.current-menu-item ul.sub-menu, li.current-menu-parent ul.sub-menu { display: block; visibility: visible; !important}

snoffoz comments:

Almost,

If I click on one of the image thumbnails under the tap "Projecten" the list of child pages disappears.

Hai Bui comments:

It doesn't disappear for me. I click "Woningen 6" and the list of child pages is still visible

snoffoz comments:

I tried both Chrome and Safari and they disappears in both of them as soon as I click on a thumbnail images (Woningen 6, fo instance).

snoffoz comments:

Hi Ross Wilson,

jQuery would be fine too. And would work better in IE right?

Ross Wilson comments:

You can add both of these lines to your code (below your click handlers) to handle keeping the menu open when a sub item is clicked and keeping the project menu open. Try them out and let me know if it needs any tweaks

$('.current-menu-item').parent('.sub-menu').css('visibility', 'visible');
$('.current-menu-item.parent').find('.sub-menu').css('visibility', 'visible');


snoffoz comments:

Hi Ross Wilson,

The code almost works!

But when I go to:

"Projecten > Woningen 6" the list of child pages goes away.

Maybe this was unclear.
If I click on one of the image thumbnails under the tap "Projecten" the list of child pages disappears.

Why is that?
(im trying this out on localhost)

Ross Wilson comments:

Try updating the code to this


$('.current-menu-item').parent('.sub-menu').css('visibility', 'visible');
$('.current-menu-item.parent, .current-portfolio-ancestor').find('.sub-menu').css('visibility', 'visible');


snoffoz comments:

That did it!

Only a few questions.

Would it be possible to close the child pages with a duble click on the parent (Projecten, Bureau)?

And if I want to highlight the current page im on so it shows in read in the menu how would i do this?

Ross Wilson comments:

This will get the current page to show as red (in your css file):

ul.sub-menu li.current-portfolio-parent a {
color: red;
}
ul.sub-menu li.current_page_item a {
color: red;
}


For the double click you might run into problems, because a single click will be detected first, and that single click takes you to a new page. I can write a function to handle the doubleclick, but you would probably have to disable the single click functionality for it to be consistent

snoffoz comments:

Almost there!

I still can't get any highlight when Im clicking on a child category under "Projecten".
Se here: http://wptemp.site90.net/works/maatschappelijk/ (the page is online here)

Is it possible to make a single click to show and hide the child categories?

Or if I keep it the way it is i could just remove $('.jsddm > li').bind('dblclick', jsddm_timer); ?

Ross Wilson comments:

Add this also to your css

ul.sub-menu li.current-menu-item a {
color: red;
}


Ross Wilson comments:

For handling the collapse of the menu do the following:

add this line after the click handlers:

$('li.current-menu-ancestor>a, li.current-menu-item.parent>a').attr('href','');


change the following function to look like this:
function jsddm_open() {
jsddm_canceltimer();
var close = $(this).find('ul').css('visibility') == 'visible';
ddmenuitem = $(this).find('ul').css('visibility', 'visible').parent().addClass('jsddm_hover').end();
if(close)
jsddm_close();
return false;
}

snoffoz comments:

The CSS works fine now but the menu doesn't. Can't click the links and one parents child categories doesn't go away if you click on another parents menu point.

Ross Wilson comments:

Change this function


function jsddm_open() {
if ($(this).is('.current-menu-ancestor, .current-menu-item.parent')){
jsddm_canceltimer();
var close = $(this).find('ul').css('visibility') == 'visible';
ddmenuitem = $(this).find('ul').css('visibility', 'visible').parent().addClass('jsddm_hover').end();
if (close)
jsddm_close();
return false;
}
}


snoffoz comments:

Better, but no dice.
Have a look [[LINK href="http://wptemp.site90.net/works/projecten/"]]http://wptemp.site90.net/works/projecten/[[/LINK]]

Ross Wilson comments:

There is an extra } above function jsddm_close() {

snoffoz comments:

Can't seem to get it to work. Maybe I did something wrong?
[[LINK href="http://wptemp.site90.net/"]]http://wptemp.site90.net/[[/LINK]]

Ross Wilson comments:

If you can send your ftp info to [email protected] I can get it fixed

Ross Wilson comments:

I think we are looking good now, do you agree snoffoz?