Javascript 如何使用jquery在stick中显示小徽标并隐藏大图像

我正在尝试集成一个小的图像时，粘性菜单出现请看这个链接

当我们向下滚动时，你可以看到带有小徽标的粘滞菜单，但这并不好，因此我设计了一个徽标，如果粘滞菜单出现并隐藏该图像，则需要替换该徽标

这里是我正在使用的代码

<header class="header" id="home">    

<!-- COLOR OVER IMAGE -->
<div class="color-overlay"> <!-- To make header full screen. Use .full-screen class with color overlay. Example: <div class="color-overlay full-screen">  -->

    <!-- STICKY NAVIGATION -->
    <div class="navbar navbar-inverse bs-docs-nav navbar-fixed-top sticky-navigation">
        <div class="container">
            <div class="navbar-header">

                <!-- LOGO ON STICKY NAV BAR -->
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#kane-navigation">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                </button>

                <a class="navbar-brand" href="#"><img src="images/logo023.png" alt=""></a>

            </div>

            <!-- NAVIGATION LINKS -->
            <div class="navbar-collapse collapse" id="kane-navigation">
                <ul class="nav navbar-nav navbar-right main-navigation">
                    <li><a href="#home">Home</a></li>  
                    <li><a href="#features">Sorrento Histology</a></li>
                    <li><a href="#brief2">Sorrento Overview</a></li>
                    <li><a href="#download">Products in Development</a></li>
                    <li><a href="#profile">Company Profile</a></li>
                    <!-- <li><a href="#screenshot-section">Screenshots</a></li> -->
                    <li><a href="#contact">Contact Us</a></li>
                </ul>
            </div>
        </div> <!-- /END CONTAINER -->
    </div> <!-- /END STICKY NAVIGATION -->


    <!-- CONTAINER -->
    <div class="container">

        <!-- ONLY LOGO ON HEADER -->
        <div class="only-logo">
            <div class="navbar">
                <div class="navbar-header">
                    <img src="images/logo.png" alt="" style="width:312px;height:187px">
                </div>
            </div>
        </div> <!-- /END ONLY LOGO ON HEADER -->

        <div class="row">
            <div class="col-md-8 col-md-offset-2">

                <!-- HEADING AND BUTTONS -->
                <div class="intro-section">

                    <!-- WELCOM MESSAGE -->
                    <h1 class="intro">Welcome to Haider Biologics</h1>
                    <h5>Want to know more?</h5>

                    <!-- BUTTON -->
                    <div class="buttons" id="download-button">

                        <a href="#download" class="btn btn-default btn-lg standard-button"><i class="icon-app-download"></i>Click Here</a>

                    </div>
                    <!-- /END BUTTONS -->

                </div>
                <!-- /END HEADNING AND BUTTONS -->

            </div>
        </div>
        <!-- /END ROW -->

    </div>
    <!-- /END CONTAINER -->
</div>
<!-- /END COLOR OVERLAY -->
</header>
<!-- /END HEADER -->

切换导航








欢迎来到海德尔生物制品公司
想知道更多吗？

默认情况下，在页面加载时写入此行

$(".navbar-brand").css("display","none");

然后添加以下代码段

$(window).scroll(function () { 
var top = $(window).scrollTop();
    if(top>=100){
       $(".navbar-brand").css("display","block");
    }
    else{
       $(".navbar-brand").css("display","none");
    }
});

将所有代码段写入

$(document).ready(function(){

});

---

您尝试过的脚本在哪里？当您看到左上角的徽标变为粘性时不起作用。如果粘性不存在，我们是否可以隐藏当粘性标题变为粘性时它应该显示？当您看到左上角的徽标变为粘性时不起作用。如果粘性不存在，我们是否可以隐藏当粘性标题变为粘性时它应该显示？您是否看到我在左上角提供的链接如果没有粘性菜单，则我想显示徽标如果粘性菜单出现默认情况下，小徽标应隐藏，当粘性菜单出现时，应显示徽标。。这是你想要的吗？