Results 1 to 6 of 6

Thread: AnyLink CSS 2.2 - Add a Delay? (mega drop-down)

  1. #1
    Join Date
    Jul 2009
    Posts
    8
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Question AnyLink CSS 2.2 - Add a Delay? (mega drop-down)

    1) Script Title: AnyLink CSS Menu v2.2

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...anylinkcss.htm

    3) Describe problem: I've used this script to create a mega drop-down menu on our site. (http://www.thewatchprince.com/) I'm really happy with the results except for one thing... The drop-downs appear INSTANTLY on mouseover. If you are moving your mouse across the menu a lot (like to our search box or the browser's back button) the menus overlap as they flash on and off and fade in and out constantly.

    I didn't think it was a big deal at first, but it's really bugging me now and I can see our customer support reps struggling to avoid the drop-downs as they try to navigate the site while on the phone with customers. NOT good

    What I've realized we need is a slight delay before the menus appear. Jakob Nielsen (see "Speed" at http://www.useit.com/alertbox/mega-dropdown-menus.html) advises a .5 second delay, but I think that might be overkill. I just want users to pause the mouse on a link before the drop-down appears.

    Is a delay possible?

  2. #2
    Join Date
    Aug 2004
    Posts
    10,138
    Thanks
    3
    Thanked 1,007 Times in 992 Posts
    Blog Entries
    16

    Default

    Sure, try the below modified .js file, which should add a 300 millisec delay before the drop down menu appears onMouseover of its anchor link. You can adjust 300 as desired obviously.
    Last edited by ddadmin; 11-21-2009 at 09:46 PM.
    DD Admin

  3. The Following User Says Thank You to ddadmin For This Useful Post:

    mimib (11-19-2009)

  4. #3
    Join Date
    Jul 2009
    Posts
    8
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default Solution worked! but mouseover css styling missing

    That worked great! I set it for 100 and it is just enough of a delay to prevent the constant on/off of the dropdowns. I am really pleased! Thank you so much.

    There is one side effect, though. My css styling for the links in the menu bar no longer work in FF or Chrome. When you mouseover the main menu bar, the background should turn orange and the text gets an underline.

    They still work in IE, but I get this page error

    Webpage error details

    User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 2.0.50727; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729)
    Timestamp: Thu, 19 Nov 2009 16:57:51 UTC


    Message: Object doesn't support this property or method
    Line: 195
    Char: 2
    Code: 0
    URI: http://www.thewatchprince.com/core/m...57b9cf&_xt=.js

  5. #4
    Join Date
    Aug 2004
    Posts
    10,138
    Thanks
    3
    Thanked 1,007 Times in 992 Posts
    Blog Entries
    16

    Default

    Ah yes a bug is what that is. I've edited my previous post above to include the fixed version.
    DD Admin

  6. The Following User Says Thank You to ddadmin For This Useful Post:

    mimib (11-23-2009)

  7. #5
    Join Date
    Jul 2009
    Posts
    8
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Thumbs up Anylink CSS 2.2 - Mega Drop Down

    Beautiful!!! You should update your page with this revised script and then reposition AnyLink as a Mega DropDown Menu!!! Ever since Jakob Nielsen (http://www.useit.com/alertbox/mega-dropdown-menus.html) recommended mega dropdown menus, people have been looking all over for a good script to achieve this functionality. None of the offerings out there come close to the neatness and simplicity your script offers!

    I am reallly happy! --mimib

  8. #6
    Join Date
    Jan 2009
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    One problem I have found with the Mega-dropdown menu is that it takes forever to load. Dial-up users may not wait and move on.

Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •