JQuery页面滚动动画仅适用于第一个链接

时间:2016-01-21 14:21:40

标签: javascript jquery html scroll

我的 HTML 包含3个链接

.parent().parent().parent()

当我点击链接1时,页面将向下滚动到名为 niva3-dolj 的div。当我点击链接2或3时,内容不会向下滚动。我希望它向下滚动。

如果我双击,内容将在几秒钟内出现并消失,是否有任何解决方案?

这是一个片段:

<a href="#" class="niva3" data-target="#get1">Link 1</a> 
<a href="#" class="niva3" data-target="#get2">Link 2</a>
<a href="#" class="niva3" data-target="#get3">Link 3</a>

<div class="niva3-dolj" id="get1">[include id="1365"]</div>
<div class="niva3-dolj" id="get2">[include id="1562"]</div>
<div class="niva3-dolj" id="get3">[include id="1565"]</div>
$('a.niva3').click(function() {
  function show(sel) {
    var el = $(sel);
    el.fadeToggle();
    $('.niva3-dolj').not(el).fadeOut('fast');
  }

  $('.niva3').removeClass('niva3-farg')
  $(this).addClass('niva3-farg');
  show($(this).data('target'));
  $('html, body').stop(true, true).delay(200).animate({
    scrollTop:$('.niva3-dolj').offset().top
  }, 'slow');
});
.niva3 {
  color: #97bf1f;
}
    
.niva3-farg {
  color: #4d4d4d !important;
}
    
.niva3-dolj {
  display: none;
}

0 个答案:

没有答案