修复了在此处检查解决方案后导航不起作用

时间:2018-08-02 09:07:06

标签: fixed sticky

这是我的HTML和JQuery

我试图用jquery固定导航栏,并且即使没有jquery,固定的位置也不只是工作。无法弄清楚出了什么问题。我已经尝试了相关帖子中给出的建议,但似乎没有任何效果。我使用chrome浏览器检查了元素,当我向上滚动时,sticky类被添加到导航中,但不会使其粘在顶部。

0 1 * * *   ./backupDB.sh

还有我的CSS

<!DOCTYPE html>
<html>
<head>
    <title>From Scratch</title>
    <link rel="stylesheet" type="text/css" href="stylesheet.css">
    <link rel="stylesheet" type="text/css" href="web-fonts-with-css/css/fontawesome-all.min.css">
    <script src="jquery.min.js"></script>
    <script type="text/javascript">
        $(window).scroll(function(){
            if($(this).scrollTop()>0){
                $('nav').addClass("sticky");
            }
            else
            {
                $('nav').removeClass("sticky");
            }
        })
    </script>

</head>
<body>
<header>
<div class="container">
    <div class="row">
        <div class="col-6 right">
            <ul>
                <li><a href="#"><i class="fab fa-facebook-f fa-.5x" aria-hidden="true"></i></a></li>
                <li><a href="#"><i class="fab fa-twitter fa-.5x" aria-hidden="true"></i></a></li>
                <li><a href="#"><i class="fab fa-pinterest-p fa-.5x" aria-hidden="true"></i></a></li>
                <li><a href="#"><i class="fab fa-google-plus-g fa-.5x" aria-hidden="true"></i></a></li>
                <li><a href="#"><i class="fab fa-youtube fa-.5x" aria-hidden="true"></i></a></li>
                <li><a href="#"><i class="fab fa-skype fa-.5x" aria-hidden="true"></i></a></li>
            </ul>
        </div>
        <div class="col-6 contact left" align="right">
        <ul>
            <li><a href="#"><i class="fas fa-phone fa-1x" aria-hidden="true"></i></a></li>&nbsp<span>+2348063956087</span>&nbsp&nbsp
            <li><a href="#"><i class="fas fa-mobile-alt fa-1x" aria-hidden="true"></i></a></li>&nbsp<span>+2348063956087</span>&nbsp&nbsp
            <li><a href="#"><i class="fas fa-envelope fa-1x" aria-hidden="true"></i></a></li>&nbsp<span>valamasiatu@gmail.com</span>
            </ul>
        </div>
        </div>
    </div>

    <nav>
        <div class="container no-padding">
        <div class="logo">
            <img src="images/logo81.png" alt="">
        </div>
            <ul>
                <li class="active"><a href="#">Home</a></li>
                <li><a href="#">About</a></li>
                <li><a href="#">Services</a></li>
                <li><a href="#">Blog</a></li>
                <li><a href="#">Promo</a></li>
                <li><a href="#">Contact</a></li>
            </ul>
        </div>
        </nav>

<div class="hero">
    <div class="herotext" align="center">
        <h2>Responsive Web Design</h2>
        <p>Webama offers their subscribers the best and total experience in responsive web design, logo design, 
free web hosting and professional desktop and adndroid application experience</p>
<a href="#" class="button">Get Started</a>
    </div>
</div>

</header>


<div class="intro">

</div>

</body>
</html>

0 个答案:

没有答案