jquery - 使用 jQuery 切换时移动到 DIV

Question

我一直在阅读，我试图让屏幕移动到正在切换的 div。它位于我网站的底部，因此当您切换联系表单时，除非向下滚动，否则您无法判断它是否存在。

我有这个似乎不起作用的 jQuery 片段

//contact toggle
$("#show-con").click(function(){
  $("#contact-wrap").slideToggle("slow");
  $("#contact-wrap").animate({scrollTop: $("#contact-wrap").offset().top});
});

切换工作正常，但它不会滚动到 div。

我在这里阅读了一些较旧的文章，但不幸的是，它们链接到不再活跃的网站。

Answer 1

这将起作用，html, body用于您的选择器：

$("#show-con").click(function(){
  $("#contact-wrap").slideToggle("slow");

  if ($("#contact-wrap").is(':visible')) {
     $("html, body").animate({scrollTop: $("#contact-wrap").offset().top});
  }
});

还添加了检查元素是否仅可见，否则滚动不可见。

Answer 2

要为所有div有开关的 s 定义这个，请参考http://jsfiddle.net/LkTf8/79/。

$(document).ready(function() {
  $(".trigger").click(function(e){
  var $toggled = $(this).attr('id');
  var $paneltoggled = $(this).next(".panel").attr('id');

  $(this).next(".panel").slideToggle('slow'); 
  if ($("#" + $paneltoggled).is(':visible')) {
    $("html, body").animate({scrollTop: $("#" + $paneltoggled).offset().top});}    
  });
});