2

我有一个功能，当标题向下滚动时到达某个 div 时，徽标会向下滑动到导航栏上。这可行，但使用 jQuery 向下滑动似乎“显示”了 div，而不是一次显示整个 div 并将该 div 向下滑动。

它正在做的事情是正常的，因为我正在使用这里的元素：

http://api.jquery.com/slideDown/

但是当我悬停在导航上时，我喜欢这个例子：http: //aaronjwood.com/

是否有另一种使用 JQuery 的 CSS 方法？任何链接都会很棒！

这是我的 jQuery 来支持我的问题：

$(".logo .visible").hide(); 

    var topOfOthDiv = $("#home-2").offset().top;

    $(window).scroll(function(e) {
        e.preventDefault();
        if($(window).scrollTop() > topOfOthDiv) { //scrolled past the other div?
            $(".logo .visible").slideDown(300); //reached the desired point -- show div
        }else{
            $(".logo .visible").slideUp(300);
        }
    });

标志CSS：

h1.logo {
    width:126px;
    height:58px;
    float:left;
    margin:0 0 0 40px;
    margin-left:40px;

}

.logo .visible{
    display:none;
    height:100%;
    background-color:#2e2e2e;
    background:url(../images//logo.jpg) no-repeat;
}

html

<div id="nav">
        <div class="nav_wrapper">
        <h1 class="logo"><div class="visible"></div></h1>
            <ul id="navigation">
            </ul>
        </div>
     </div>

在 js 小提琴中，当单击该项目时，面板“显示”自身，而不是将 div 整体向下滑动（如示例链接进一步向上 ^^）。希望这是有道理的。

链接：http: //jsfiddle.net/sVCvF/

4

1 回答 1

0

而不是slideDown你可以用animate它来滑动它。例如你可以使用这个：http: //jsfiddle.net/sVCvF/

$(document).ready(function(){
  $("#flip").on('click', function(){
      $("#panel").animate({'margin-top': 0}, 1000);
  });
});

您确实需要对此代码进行一些调整

于 2013-06-25T14:21:28.153 回答