美文网首页
JQuery之点击右边div,左边div滑动到指定位置

JQuery之点击右边div,左边div滑动到指定位置

作者: Cute_小肥鸡 | 来源:发表于2020-07-09 15:41 被阅读0次
$(document).off("click",".J_drag_grid").on("click",".J_drag_grid",function(){
  var thisExID = $(this).attr("e_i");

  //添加选中样式
  $('.mdc_mrtpm_Left li.paper-section-li').removeClass("active");
  $('.mdc_mrtpm_Right .J_drag_grid').removeClass("active");
  $(this).addClass("active");
  $('.mdc_mrtpm_Left li.paper-section-li[e_i="'+thisExID+'"]').addClass("active");

  //获取元素距离顶部的距离,将div滑动到指定位置
  var scrollTop = $('.mdc_mrtpm_Left li.paper-section-li[e_i="'+thisExID+'"]').offset().top;
  $('.web-content').animate({
    //$('.web-content').animate({})此动画要用在有overflow-y的地方,才能起作用。
    scrollTop: scrollTop
  }, 200);

  //取消选中样式
  setTimeout(function(){
    $('.mdc_mrtpm_Left li.paper-section-li').removeClass("active");
    $('.mdc_mrtpm_Right .J_drag_grid').removeClass("active");
  },1000);
});
效果图

相关文章

网友评论

      本文标题:JQuery之点击右边div,左边div滑动到指定位置

      本文链接:https://www.haomeiwen.com/subject/mhlscktx.html