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定义此内容，请参阅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});}    
  });
});

使用jQuery切换时移动到DIV

2 个答案: