Slow Down Drop Down Menu?

  • Hi – I’m fairly new to CSS, and I’ve been tinkering with the Constructor theme. The site is *almost* done, but I’ve been getting complaints from the testers about how fast the top dropdown navigation menu options disappear. They can’t get their mice over to the options to click on them before they vanish.

    What controls how fast the drop-down menu items appear and disappear? How can I change it? Do I need a plugin? Do I need to put in a CSS3 transition property – and if so, to apply to what, exactly?

    The site is https://follen.org/wp/
    I’m using Constructor 1.4.3 / WordPress 3.1.1

    Thank you,

    Meg

Viewing 13 replies - 1 through 13 (of 13 total)

  • I am assuming you mean the menus at the very top. Is it pixopoint-menu that is creating those menus? If so look in pixopoint-menu/scripts/ for the settings file. Its labeled pretty clearly. But it kinda looks like that plugin is an interface to those settings– not sure, though as I’ve never used it.

    Thread Starter megmuck

    (@megmuck)

    Sorry – I was fooling with Pixopoint to see if I could make it work just now (I couldn’t.) It’s back to normal now.

    thank you,

    Meg

    What is generating those menus then? Its Javascript because they don’t work with Javascript disabled, but what is the script? Is it custom?

    Thread Starter megmuck

    (@megmuck)

    I set them up in the Constructor theme Customize Theme/Header tab, then changed the appearance in the stylesheet (style.css) — just putting in a gradient background, changing the width and height. I haven’t touched the header.php file.

    Like I said. I’m new to all this.

    Meg

    In constructor and probably other themes there should be a JS folder under the wp-content/themes/<theme name>/js. In that folder there should be a javascript file (ready.js for constructor). In the file look for the .slideUp or .hide api and put a .delay() just before that entry. I set mine to ‘900’ and that seems to work well.

    Thread Starter megmuck

    (@megmuck)

    THANK YOU!!!!!!!! It worked! It worked! Macombs, you are my hero.

    For folks like me who don’t do much coding, here’s what that file looks like now. I inserted the line $(this).delay(900);

    .slideDown()
    ;
    }, function(){
    $(this)
    .removeClass(‘hover’)
    .children(‘ul’)
    .slideUp()
    ;
    $(this).delay(900);
    $(this).find(‘div.menu-header-menu-container’)
    .children(‘ul’).slideUp()
    ;
    });

    m.

    You’re welcome Meg. You may want to try putting your delay just before the .slideup and see if that makes a difference. When I looked at the website you listed above it still seemed that the menu disappeared as soon as I moused off the menu. Here’s how I coded it:

    }, function(){
    $(this)
    .removeClass(‘hover’)
    .children(‘ul’)
    .delay(‘900’)
    .slideUp()
    ;
    $(this).find(‘div.menu-header-menu-container’)
    .children(‘ul’)
    .delay(‘900’)
    .slideUp()
    ;
    });

    Hi there,

    I’m using a theme (clean-simple-white) that doesn’t have any js directory. Is there a default WP directory where I could tinker with the drop-down settings.

    My concern is people passing up the top-level navigation link too quickly and missing the entire page because they’re assuming they have to click one of the child links.

    I looked at hiding the top link but, this theme puts the navigation elements in the CSS and doesn’t use the <wp_list_pages…> function (I believe to the best of my ability as I cannot find anywhere in the theme’s code>.

    Thanks!

    Is there a default WP directory where I could tinker with the drop-down settings

    No.

    Hey esmi so am I limited to not being able to change this menu drop-down speed? I’m assuming it’s .js so thought it had to be controlled by WP. Is this type of menu browser-based controlled? (I’m clearly wandering off the reservation yes but, am trying ??

    Dropdowns are controlled by your theme’s files – not core. And please post a new topic. The thread is over 2 months old and references a completely different theme.

    I don’t think you should be so rash, and end this thread. There are many people who still have this problem.
    The fix may not lie in the .JS folder. You might be experiencing this problem if the theme is using CSS for the menu. Find the
    “li” code that is controlling the sub menu page links, and apply a margin of -5px or -10px.
    Check to see if this fixes the problem, and if so, apply a line height margin to get your menu items back in the middle of the nav, or to wherever they were before the negative margin change.

    I thought relevancy was important – not the date of the post. If someone should start a new thread to discuss the same subject aren’t we making this somewhat of a duplicitous process? Are you fond of finding 27 different answers to the same question on 14 different websites? I’m not.

    I also thought you might be interested in some what might be helpful user feedback so far as our experience but, I guess not. I mean, hey why would anyone want to actually click links in a navigation area… it’s much better to look good than to actually function eh? I do appreciate your work though but, not the attitude :/

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘Slow Down Drop Down Menu?’ is closed to new replies.