7

私が望むのは、基本的に「セクション」のクラスを持つ次の div にページをスクロールするための NEXT および PREV ボタンを使用した固定ナビゲーションです。

基本的にクリック機能を NEXT および PREV の href に追加するように jQuery をセットアップしました。このクリック関数は、ScrollTop を使用して、.section クラスの次の duv に移動します。

jQuery は次のとおりです。

$('div.section').first();
// binds a click event-handler to a elements whose class='display'
$('a.display').on('click', function(e) {
    // prevents the default action of the link
    e.preventDefault();
    // assigns the text of the clicked-link to a variable for comparison purposes
    var t = $(this).text(),
      that = $(this);
      console.log(that.next())    
      // checks if it was the 'next' link, and ensures there's a div to show after the currently-shown one
      if (t === 'next' && that.next('div.section').length > 0) {
      //Scroll Function
      $('html, body').animate({scrollTop:that.next('div.section').scrollTop()});
  } 
    // exactly the same as above, but checking that it's the 'prev' link
    else if (t === 'prev' && that.prev('div.section').length > 0) {
      //Scroll Function
       $('html, body').animate({scrollTop:that.prev('div.section').scrollTop()});     
  }
});

私は現在、あなたが消化するのを助けるために、非常にコメントされたjQueryでJSfiddleに取り組んでいます: http://jsfiddle.net/ADsKH/1/

次の .section を判断するために現在 (that.next()) をチェックしている console.log がありますが、非常に奇妙な結果が返ってきます。

これが意図したとおりに機能しないのはなぜですか?

4

1 に答える 1

9

内にネストされているためthat、 a を見つけることができません。.next('.section').navigation

のjQueryドキュメントから.next()。

一致した要素のセット内の各要素の直後の兄弟を取得します。

コードに基づいた実際の例を次に示します

于 2013-02-28T01:58:37.383 に答える