Question

我无法让jQuery localScroll工作。我尝试了一切，请帮助我，我仍然是一个菜鸟。我尝试了多种方法，但没有任何作用！请查看我的代码并告诉我，如果您知道如何解决这个问题，请！

CSS

＆＃13;

@import url('https://fonts.googleapis.com/css?family=Lato');

@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:700');

@font-face {
    font-family: 'Streamster'; /*a name to be used later*/
    src: url('http://127.0.0.1:56585/fonts/Streamster.ttf'); /*URL to font*/
}

#button {
    background-color: white; 
    border: none;
    color: BLACK;
    padding: 15px 32px;
    margin-top: -20px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    font-family: 'Source Sans Pro', sans-serif;
    margin-top:10%;
}

.logo{
    margin-left: 140px;
    margin-top: 10px;
    margin-bottom:10px;
    height: 50px;
    width: 50px;
    float: left;
}

#logo1{
    margin-left: 140px;
    margin-top: 20px;
    margin-bottom:10px;
    height: 50px;
    width: 150px;
    float: left;
    color: white;
    font-family: 'Source Sans Pro', sans-serif;
}



header {
    background: rgba(0,0,0,1);
    width:100%;
    z-index: 1000000;
}

header::after {
   content: '';
display: table;
    clear:both;
}

nav {
    display:inline-block;
    float: right;
    padding-right: 10%;
    
}

nav ul {
    margin: 0;
    padding:0 ;
    list-style: none; 
}

nav li {
    display: inline-block;
    margin-left: 70px;
    padding-top: 28px;
    position: relative;
    
}

nav a{
    color: white;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 700;
}

nav a:hover {
    color: #fff;
}

nav a::before {
    content: '';
    display: block;
    height: 5px;
    width: 100%;
    background-color: #fff;
    position: absolute;
    top: 0;
    width: 0%;
    transition: all ease-in-out 200ms;
}

nav a:hover::before {
    width: 100%;
}

html, body {
    overflow-x: hidden;
    margin: 0;
    height: 100%;
    font-family: 'Lato', sans-serif;
    
}


section {
    position: relative;
    margin: 0 -9999rem;
    padding:9.25rem 9999rem;
    text-align: center;
    
}

#welcomesec{
    background-image:url(ele.jpg);
    height: 90vh;
    background-repeat: no-repeat;
    background-position: 50% 50%;
}

#welcomesec h1 {
    padding-top:10%;
    text-align: left;
    text-align: center;
    color: #ecf0f1;
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 95px;
    
}

#about{
    background-color: #fff;
    color: black;
    
}

#about p{
    padding-left: 20%;
    padding-right:20%;
    text-align: center;

}

#portfolio{
    background-color: black;
    color: #ecf0f1;
}

#contact{
    background-color: black;
    color: #ecf0f1;
}

.sectionImg {
    position: relative;
    margin: 0 -9999rem;
    padding:5.25rem 9999rem;
    text-align: center;
    
}

.sectionImg1 {
    position: relative;
    float: right;
    padding:1.25rem 9999rem;
}

img{
    padding: 5px;}

    
#clientssection{
      background:white;
       color:black;
}

#clientssection p{
    padding-left: 20%;
    padding-right:20%;
    text-align: center;
}

@media only screen and (max-device-width:990px){
    
}

HTML

＆＃13;

<!DOCTYPE html>
<html>
<head>  
    <title>SLAD DEVELOPMENT</title>
    <link rel="stylesheet" type="text/css" href="style.css">
    <link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
    <script type="text/javascript" src="custom.js"></script>
</head>
<body>
<header>
    <Div id="gg"><div id="header" class="container">
    <!--<img src="logo.png" alt="logo" class="logo">-->
        <h1 id="logo1">SLAD ©</h1>
    <nav>
    <ul>
        <li ><a href="#welcomesec" class="slide-section">Home</a></li>
        <li><a href="#about" class="slide-section">About</a></li>
        <li><a href="#portfolio" class="slide-section">Portfolio</a></li>
        <li><a href="#clientssection" class="slide-section">Clients</a></li>
        <li><a href="#contact" class="slide-section">Contact</a></li>
    </ul>
    </nav>
    </div></Div>
</header>
    
    <section id="welcomesec">
        <h1>Creativity is key.</h1>
        <a id="button" class="slide-section" href="/#about">EXPLORE</a>
    </section>
    
     <section id="about">
        <h1>About Myself</h1>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed hendrerit erat quis enim dapibus, a commodo mi accumsan. Cras tempor ullamcorper ligula convallis aliquam. Mauris in diam sed enim ultricies venenatis. In eleifend eros eget mi dignissim aliquam. Aliquam at urna eu mi pulvinar ullamcorper eget at lectus. Aliquam mi neque, porttitor in massa eu, vulputate finibus eros. Vivamus suscipit lectus id ex aliquam rutrum. Aenean efficitur sed odio at vulputate. Nunc elementum bibendum aliquam. Nam lacinia velit at leo ornare, et convallis erat rutrum.</p>
         
    </section>
    
     <div class="sectionImg" id="portfolio">
        <h1>Portfolio</h1>
         <img src="http://placehold.it/350x300">
         <img src="http://placehold.it/350x300">
         <img src="http://placehold.it/350x300">
         <img src="http://placehold.it/350x300">
         
    </div>
    
    <section id="clientssection">
        <h1>Clients</h1>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed hendrerit erat quis enim dapibus, a commodo mi accumsan. Cras tempor ullamcorper ligula convallis aliquam. Mauris in diam sed enim ultricies venenatis. In eleifend eros eget mi dignissim aliquam. Aliquam at urna eu mi pulvinar ullamcorper eget at lectus. Aliquam mi neque, porttitor in massa eu, vulputate finibus eros. Vivamus suscipit lectus id ex aliquam rutrum. Aenean efficitur sed odio at vulputate. Nunc elementum bibendum aliquam. Nam lacinia velit at leo ornare, et convallis erat rutrum.</p>
    </section>
    
      <section id="contact">
        <h1>Feel free to Contact me </h1>
          <a href="https://twitter.com/CSGOSLAD?lang=en" target="_blank"><i class="fa fa-twitter-square" style="color:white; font-size:2em;" aria-hidden="true"></i></a>
          <A>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</A>
          <a><i class="fa fa-facebook-square" style="color:white; font-size:2em;" aria-hidden="true"></i></a>
          
          
    </section>

    </body>  

</html>

＆＃13;

无法让jQuery localScroll在我的代码中工作

0 个答案: