0

私はJavaScriptに非常に慣れていないため、これを自分で追加する方法がわかりません。

    $(document).ready(function() {
  $('.nav a').on('click', function(e) {
    e.preventDefault();

    var target = $(this).attr('href'),
      offset = $(target).offset().top - 70;

    $('html, body').stop().animate({
      scrollTop: offset
    }, 500);
  });
$('.scroll ul li').click(function(e) {
  var $this = $(this);
  var prev = $(this).parent().find('.active');
  prev.removeClass('active');
  if (!$this.hasClass('active')) {
    $this.addClass('active');
  }
  e.preventDefault();
});
});

これは私が使用しているスクロール コードであり、ナビゲーション バーでうまく機能します。

しかし、私はちょうどこのボタンを追加しました

  <a href="#about" class="btn btn-circle page-scroll">
    <i class="fa fa-angle-double-down animated"></i>

スクリプトがそのボタンでも同じように動作するようにするにはどうすればよいですか? http://codepen.io/sbxn14/pen/egmKRr <-- このサイトを含む私の codepen。

誰かが私を助けてくれることを願っています。

編集：
私はそれを追加しています。ページを手動でスクロールすると、ナビゲーション バーのアクティブなリンクが切り替わるようにすることはできますか? 私はこれについてグーグルで探してきましたが、何も見つけることができませんでした。

4

1 に答える 1

0

ナビゲーション バーのリンクのようにボタンをスクロールするには、新しいクラスをクリック ハンドラーに追加するだけです。

それ以外の：

$('.nav a').on('click', function(e) {

次のように、新しいクラスをクリック ハンドラーに追加するだけです。

$('.nav a, .page-scroll').on('click', function(e) {

または、次のようにすることもできます。

$('.nav a').add('.page-scroll').on('click', function(e) {

.active次のように、ボタンがクリックされたときに対応するナビゲーション バー セグメントにクラスを追加することにより、ナビゲーション バーで新しく表示された領域を強調表示することもできます。

$('.page-scroll').click(function(e) {
   $('.navbar-nav li:nth-child(2)').addClass('active');
});

これは、セクションへのボタンのスクロールと、ナビゲーションバーの強調表示された部分の変更の両方を示す更新されたペンです。About

お役に立てれば！:)

于 2017-01-06T02:58:11.387 に答える