【问题标题】:jquery mobile slide reverse transition shows blank page in middle of transitionjquery mobile幻灯片反向过渡在过渡中间显示空白页
【发布时间】:2012-05-24 15:05:41
【问题描述】:

由于某种原因,在 ipad 上,当默认向左滑动 [幻灯片] 时,页面之间的 jquery 移动幻灯片过渡效果很好。但是当它是向右滑动 [slide reverse] 时,在转换过程中,页面之间似乎有一个空白页面

<div data-role="page" id="zine1">
   <div data-role="content">    
              VARIOUS HTML CONTENT
   </div><!-- /content -->
</div>
<div data-role="page" id="zine2">
   <div data-role="content">    
              VARIOUS HTML CONTENT
   </div><!-- /content -->
</div>
<div data-role="page" id="zine3">
   <div data-role="content">    
              VARIOUS HTML CONTENT
   </div><!-- /content -->
</div>
<script>
   $(document).ready(function() {
        window.now = 1;

        //get an Array of all of the pages and count
        windowMax = $('div[data-role="page"]').length; 

        doBind();
    });
    // Functions for binding swipe events to named handlers
    function doBind() {
        $('div[data-role="page"]').live("swipeleft", turnPage); 
        $('div[data-role="page"]').live("swiperight", turnPageBack);
    }

    function doUnbind() {
        $('div[data-role="page"]').die("swipeleft", turnPage);
        $('div[data-role="page"]').die("swiperight", turnPageBack);
    }

    // Named handlers for binding page turn controls
    function turnPage(){
        // Check to see if we are already at the highest numbers page            
        if (window.now < windowMax) {
            window.now++
            $.mobile.changePage("#zine"+window.now, {transition:"slide"});
        }
    }

    function turnPageBack(){
        // Check to see if we are already at the lowest numbered page
        if (window.now != 1) {
            window.now--;
            $.mobile.changePage("#zine"+window.now, {transition:"reverse slide"});
        }
    }
</script>

【问题讨论】:

    标签: ipad jquery-mobile transition slide


    【解决方案1】:

    transition:"reverse slide" 似乎已被弃用。试试 data-direction="reverse"。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-08-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2020-05-20
      相关资源
      最近更新 更多