Question

尝试使用jQuery UI模拟iPad的“在页面之间滑动”功能。

我有这两个全屏div：

<div id="introLayer" class="layer"></div>
<div id="gameLayer" class="layer" style="display:none;"></div>

在某些时候，introLayer必须隐藏向左滑动，在其滑动动作之后被gameLayer取代。

我尝试了以下内容：

    $('#introLayer').hide(
        'slide',
        { direction: "left" },
        1000);

    $('#gameLayer').show(
        'slide',
        { direction: "left" },
        1000);

这会导致introLayer很好地滑出，但gameLayer只会在之后出现并且没有任何效果。

Answer 1

$('#gameLayer').hide();    
 $('#introLayer').hide(
            'slide',
            { direction: "left" },
            1000 ,  function(){  $('#gameLayer').show(
            'slide',
            { direction: "left" },
            1000);});

尝试这样或尝试下面

$('#gameLayer').hide(); 

$('#introLayer').hide(
  'slide',
    { direction: "left" },
    1000);

$('#gameLayer').show(
    'slide',
    { direction: "right" },
    1000);

Answer 2

首先通过调用$（'＃gameLayer'）来隐藏gameLayer。隐藏（）而不是将其放入内联样式：style="display:none;"

$('#gameLayer').hide(); 

$('#introLayer').hide(
  'slide',
    { direction: "left" },
    1000);

$('#gameLayer').show(
    'slide',
    { direction: "left" },
    1000);

JQuery：在页面之间滑动

2 个答案: