単一ページの Web サイトで jquery トグル プラグインと Smoothscroll プラグインを使用しています。現在、問題は、トグル関数の非表示のテキストにより、smoothscroll jquery が適切に機能しないことです。nav オプションで「item a」をクリックすると、「item a」セクションの div までスムーズにスクロールすることになっているとします。これは無計画に行われ、非表示のテキストの高さもトグル機能で考慮されます。約100px。したがって、スムーズなスクロールではなく、目的の結果の 100 ピクセルの差もありません。
参考までに、私は html5 を使用しており、以下のコードで提供されているように、ページに 4 つのセクションがあります。
トグル関数のコードは次のとおりです。
`$(document).ready(function(){
//Hide the tooglebox when page load
$(".togglebox").hide();
//slide up and down when click over heading 2
$("h2").click(function(){
// slide toggle effect set to slow you can set it to fast too.
$(this).toggleClass("active").next(".togglebox").slideToggle("slow");
return true;
});
});`
ナビゲーションメニューのコードは次のとおりです(同じページをスクロールすることになっています):
<nav>
<ul>
<li><a href="#main">Home</a></li>
<li><a href="#work">Our Works</a></li>
<li><a href="#about-us">About Us</a></li>
<li><a href="#contact">Contact Us</a></li>
</ul>
</nav>
http://css-tricks.com/snippets/jquery/smooth-scrolling/にある Smoothscroll プラグインを使用しています。
これら2つのjqueryが衝突している理由を教えてください。
PS:私はjqueryスライドショーも使用していますが、私が知る限り、それは効果がありません.cozはそれを削除しましたが、何も変わりませんでした.