2016-08-27 9 views
4

こんにちは私は問題があります。私はクリックでアンカーから要素までスクロール必要があるが、私はエラーを取得:click to scroll

SyntaxError: missing } after property list

scrollTopスプライト:$($(this).attr('href'))element.offset().top

/* jQuery scroll to element on click */ 

$(document).ready(function(){ 

    $('nav#site-navigation ul li').click(function(){ 
    $('html, body').animate({ 
     scrollTop: $($(this).attr('href')).offset().top 
    }, 1000); 
    return false; 
    }); 

}); 

アンカーが<li>要素がhref属性を持たないWPのナビゲーションメニューに

+0

あなたのコードをクリアするために.stop()を使用することを忘れないでください代わりに**仕事だけで罰金子<a>要素なければならないのです使用してください。いくつかの行には、未公開のものがあります。コンソールはあなたの友人です。エラーを起こしている行番号を参照してください。 (または、より良いIDEコード/エディタを使用すると、すぐにそれらのエラーが表示されます。) –

+0

scrollT ... ment.js(行7、col 44) – strava1

+0

'scrollTop:$($(this)).attr( 'href' ))element.offset()。top'これは何ですか?それはあなたが実際に使用しているコードですか、それとも質問のコメントですか? –

答えて

3

です!
は、それが**

$(document).ready(function(){ 
 

 
    $('nav#site-navigation ul li a').click(function(evt) { 
 
     evt.preventDefault(); 
 
     $('html, body').stop().animate({ 
 
     scrollTop: $($(this).attr('href')).offset().top 
 
     }, 1000); 
 
    }); 
 

 
});
nav{position:fixed;top:20px;} 
 
.page{height:100vh;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<nav id="site-navigation"> 
 
    <ul> 
 
    <li><a href="#home">HOME</a></li> 
 
    <li><a href="#about">ABOUT</a></li> 
 
    <li><a href="#contact">CONTACT</a></li> 
 
    </ul> 
 
</nav> 
 
<div id="home" class="page">HOME</div> 
 
<div id="about" class="page">ABOUT</div> 
 
<div id="contact" class="page">CONTACT</div>

また、アニメーションキューに

+0

は現在正常に動作します! ty Roko – strava1

+0

よろしくお願いします! –

+0

それがあなたのために働くなら、この質問が閉じられ、Rokoが彼の報酬を得るように彼の答えを受け入れてください。 – luissimo