javascript - 我需要为我的 div 从右边的页面到中间设置动画

Question

我正在制作一个站点，其中使用 jquery 将一个 div 从站点的右侧滑到中间，再次单击时它会返回。我能够让它从左到中再到后。在最后，我需要它有多个 div，单击第一个链接会带来一个 div，单击第二个会使第一个 div 离开屏幕，第二个在它的位置。我将在这里包括我所拥有的。

$(document).ready(function(){
  $('#toggle').click(function(){
    var hidden = $('.hidden');
    if (hidden.hasClass('visible')){
      hidden.animate({"left":"-1000px"}, "slow").removeClass('visible');
    } else {
      hidden.animate({"left":"75px"}, "slow").addClass('visible');
    }
  });
});

Answer 1

你可以有这样一个功能:

$(document).ready(function(){
  $('.toggle').click(function(e){
    e.preventDefault();
    $('.hidden').animate({"left":"100%"}, "slow");
    $(this).next('.hidden').animate({"left":"0"}, "slow");
  });
});

我使用 .toggle 而不是 #toggle 因为 ID 在文档中必须是唯一的。

检查这个 Demo Fiddle