向上滑动/向下滑动

Question

我的两个页面都有上滑和下滑效果，问题是一旦关于幻灯片打开，如果我点击联系人链接，它会在向下滑动之前闪烁到联系人页面。出于某种原因，两张幻灯片的 jquery 格式相同，但是如果我在联系幻灯片打开时单击关于链接，似乎不会发生这种情况。不知道是什么问题，希望大家帮忙解决一下。

我把它上传到我的主机上，这样你们就可以自己看到它了。 http://maximsiebert.com/unamed/Untitled-1.html

这是我的 jQuery

 $(document).ready(function() {
 $('.contact').click(function () {
      if ($('#aboutpage').is(":visible")) {
        $('#aboutpage').slideUp(800)
        $('#portfolio').slideDown(800)  
        $('#portfolio').slideUp(800)
        $('#contactpage').slideDown(800)   
      }
      else if ($('#contactpage').is(":visible")) { 
      $('#contactpage').slideUp(1000) 
      $('#portfolio').slideDown(1000) 
      }
       else if ($('#contactpage').is(":hidden")) { 
      $('#portfolio').slideUp(1000) 
      $('#contactpage').slideDown(1000) 
      $('html, body').animate({scrollTop:0}, 'slow');
      }
      });

});

 $(document).ready(function() {
 $('.about').click(function () {
      if ($('#contactpage').is(":visible")) {
        $('#contactpage').slideUp(800)
        $('#portfolio').slideDown(800)  
        $('#portfolio').slideUp(800)
        $('#aboutpage').slideDown(800)   
      }
      else if ($('#aboutpage').is(":visible")) { 
      $('#aboutpage').slideUp(1000) 
      $('#portfolio').slideDown(1000) 
      }
       else if ($('#aboutpage').is(":hidden")) { 
      $('#portfolio').slideUp(1000) 
      $('#aboutpage').slideDown(1000) 
      $('html, body').animate({scrollTop:0}, 'slow');
      }
      });

});

Answer 1

通常您应该等待显示的页面向下滑动，然后向上滑动新页面。

所以你应该使用以下方法：

$('.about').click(function () {
  .... if contact page is shown ...

  $('#aboutpage').slideDown(800, function() {
     $('#aboutpage').slideUp(800);
  });
  .....

});