1

単一ページの 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はそれを削除しましたが、何も変わりませんでした.

4

1 に答える 1

0

あなたが投稿した内容に基づいて判断するのは困難ですが.hide()、CSS プロパティを に設定するのと同等の方法を使用するdisplay: noneと、ブラウザーが高さを誤って計算する可能性があります。設定visibility: hiddenしてから、アクティブにしvisibility: visibleます。

于 2012-10-03T16:35:01.937 に答える