从左向右滑动卡住

Question

我对多页幻灯片有一些奇怪的问题。当我按下切换页面时，新页面卡在左侧，然后滑出，它需要的地方。您可以在我的 JSFiddle

中进行测试

有我的JQuery。（我是新手）

$(document).ready(function(){
$("div.page-content div.page").hide();
$(".page-content div.page:first-child").show();

$("a.edit").click(function() {  // EDIT BUTTON
    $("div.page-content .page").hide();
    var activeTab = $(this).attr("href"); 
    var effect = 'slide';var options = { direction: 'right'};var duration = 1000;
    $(activeTab).toggle(effect, options, duration);
});

$("a.back").click(function() {  // BACK BUTTON
    $("div.page-content .page").hide();
    var activeTab = $(this).attr("href"); 
    var effect = 'slide';var options = { direction: 'left'};var duration = 1000;
    $(activeTab).toggle(effect, options, duration);
});

});

任何解决方案，为什么我有这个问题？

Answer 1

使用activetab滑动的切换隐藏时需要将当前页滑出才能流畅运行。使用下面的js代码，看看能不能达到你想要的效果：

$(document).ready(function(){
$("div.page-content div.page").hide();
$(".page-content div.page:first-child").show();

  $("a.edit").click(function() {    // EDIT BUTTON
    $("div.page-content .page").hide("slide", { direction: "left" }, 1000);
    $($(this).attr("href")).delay(1000).toggle('slide', { direction: "right" }, 1000);
  });

  $("a.back").click(function() {    // BACK BUTTON
     $("div.page-content .page").hide("slide", { direction: "left" }, 1000);
     $($(this).attr("href")).delay(1000).toggle('slide', { direction: "right" }, 1000);
  });
});

希望对您有所帮助。

从左向右滑动卡住

slide from left to right gets stuck

html

javascript

css

jquery

slide