Jump to content

I need to slow down my slide-in menu on hover with some JS?


PicnicTutorials

Recommended Posts

I need to slow down my Slid-In menu on hover with some JS? Is this possible?

 

Here is what I got! I have a pure css slide-in menu, and I simply am looking for some JavaScript that will enable it to slide into view a little slower. You know, with CSS, it's either there or it's not. So I'd like to animate it a little more. Thanks for your help! :)

Link to comment
Share on other sites

Hi guys! :) No, I mean it slides in from out of screen. Well, now with just CSS, it more or less just pops in. So basically, I'd like to find something that slows it down a bit. Then, if JS is off, it still works, just faster! It shouldn't take much. Finding it is the hard part.

 

Edit - like this http://www.dynamicdrive.com/dynamicindex1/slideinmenu.htm The function is there in that script. I just need some help making it work in mine and stripping out all the garbage.

Edited by Eric
Link to comment
Share on other sites

There is a setInterval value in the javascript code near the bottom that might be the secret setting for slowing it down.

Pretty sure there would not be a CSS method to slow the presentation of the drop-down. Hover effect is either on or off.

Set up that script and check the speed by adjusting the setInterval value.

Link to comment
Share on other sites

There is a setInterval value in the javascript code near the bottom that might be the secret setting for slowing it down.

Pretty sure there would not be a CSS method to slow the presentation of the drop-down. Hover effect is either on or off.

Set up that script and check the speed by adjusting the setInterval value.

 

Hi, yeah I saw that. Long story short - I'm sort of just a copy and paste JS guy - no more.

Link to comment
Share on other sites

I want a sneak peek. ;)

 

OK, I'm easy! Here's one of of them. It will be moving to a new home later. Pure CSS Slide-In (JS enhanced). Turn JS off and see it still works perfect. Also note, that the menu is position fixed (ie6 too with no jumping). Currently I have to use display none/display block hover/show for the script to work. If just CSS you can use the left -999em/ left 0 method instead in order to make screen readers happy. I really didn't contribute to any of the JS stuff - that was all Paul O'B.

Edited by Eric
Link to comment
Share on other sites

Thanks Jim! Yeah, all the JS does is slide it out/in slow. As you saw, the basic funtionality of it is not dependent on JS. That makes this type of menu the first of it's kind. You can even have drop menus that slide out of the first slide. Although, there is still one problem remianing with that that I'm trying to figure out.

Edited by Eric
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...