最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Is it possible to animate slideDown on visibility hidden element? - Stack Overflow

programmeradmin1浏览0评论

I'm trying to make SlideDown or an alternative of that effect to a nav that is bu default visibilty:hidden and what i'm doing now is like this:

$(this).find('nav.Menu').css('visibility','visible')

It's working just fine, but i have more submenus and i want an effect when hovering between the main menu to slidedown and up submenus. is this possible without display:none/block ?

JSFIDDLE

I'm trying to make SlideDown or an alternative of that effect to a nav that is bu default visibilty:hidden and what i'm doing now is like this:

$(this).find('nav.Menu').css('visibility','visible')

It's working just fine, but i have more submenus and i want an effect when hovering between the main menu to slidedown and up submenus. is this possible without display:none/block ?

JSFIDDLE

Share Improve this question edited Jan 29, 2015 at 15:11 Abude asked Jan 29, 2015 at 15:03 AbudeAbude 2,1628 gold badges36 silver badges60 bronze badges 9
  • Can you post a JSFiddle? – Ionică Bizău Commented Jan 29, 2015 at 15:06
  • what happened when you tried it? – atmd Commented Jan 29, 2015 at 15:06
  • @atmd what do you mean? i've tried only making it visible and hidden by .css in jQuery – Abude Commented Jan 29, 2015 at 15:07
  • Also please post some html – Jamie Hutber Commented Jan 29, 2015 at 15:10
  • 1 @JDB, you are absolutely right, but my nav that is hidden has a sub nav that is a sidebar which should be visible, so if i hide by display the first nav then i couldn't show the child nav, that's why i'm using visibility – Abude Commented Jan 29, 2015 at 15:12
 |  Show 4 more ments

2 Answers 2

Reset to default 8

Since your element has visibility: hidden make it visible, then hide() it and call the slideDown() function:

$('#error').css('visibility','visible').hide().slideDown();

JSFDIDLE

The hover handlers can be:

$("<selector>").hover(function () {
    $('#error').css('visibility','visible').hide().stop().slideDown();
}, function () {
    $('#error').stop().slideUp();
});

You can try positioning your submenu so it is behind its parent, toggle the visibility, and slide it out from behind the parent. You can reverse the process (slide behind, then toggle visibility) when closing the submenu.

发布评论

评论列表(0)

  1. 暂无评论