点击滚动的div的JQuery中的内容无法正常工作

Question

我已经基于链路具有在DIV滚动内容的标签部分点击位置，但滚动无法正常工作，这里是JSfiddle demo

，这是代码射击点击

$(document).ready(function ($){ 
    $('.scrollable_tab > ul > li > a[href^="#"]').on('click', function(event) { 
     var target = $(this.getAttribute('href')); 
     if(target.length) { 
      event.preventDefault(); 
      $('.scrollable_content_main').stop().animate({ 
       scrollTop: target.offset().top 
      }, 1000); 
     } 
    }); 
}); 

请帮帮忙！

Answer 1

您还需要考虑容器div。 像这样尝试。

$('.scrollable_tab > ul > li > a[href^="#"]').on('click', function(event) { 
     var target = $(this.getAttribute('href')); 
     console.log($(".scrollable_content_main").scrollTop()+target.offset().top); 
     if(target.length) { 
      event.preventDefault(); 
      $('.scrollable_content_main').animate({ 
       scrollTop: $(".scrollable_content_main").scrollTop() + target.offset().top 
      }, 1000); 
     } 
    }); 

小提琴：https://jsfiddle.net/xcht52eh/