2012-10-29 65 views
0

我已經嘗試通過Jquery MobileSudoSlider添加刷卡支持,但到目前爲止似乎不起作用。嘗試刷卡時,iPad和iPhone都沒有任何反應。我的網頁將刷卡支持添加到sudoslider,刷卡不起作用

最小工作例如:

<!doctype html> 
<html> 
    <head> 
    <title></title> 
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 
    <script type="text/javascript" src="javascripts/jquery.sudoSlider.min.js"></script> 
    <script type="text/javascript" src="javascripts/jquery.mobile.custom.min.js"></script> 
    </head> 
    <body> 
     <div id="container"> 
      <div id="pages"> 
       <ul class="pages"> 
        <li class="page" id="front"></li> 
        <li class="page" id ="about"></li> 
        <li class="page" id ="who"></li> 
        <li class="page" id="services"></li> 
        <li class="page" id="projects"></li> 
        <li class="page" id="contact"></li> 
       </ul> 
      </div> 
     </div> 
<script type="text/javascript" > 
$(document).ready(function(){ 
    var sudoSlider = $("#pages").sudoSlider({ 
     history:   true, 
     prevNext:   false, 
     continuous:  true, 
     customLink:  'a.slide-controller', 
     numericText:['home', 'mission', 'about', 'services', 'portfolio', 'contact'] 
     }); 

     $(document).keyup(function(e) { 
     switch(e.keyCode) { 
      case 37 : sudoSlider.goToSlide("prev"); break; 
      case 39 : sudoSlider.goToSlide("next"); break; 
     } 

     $("#pages").swiperight(function() { 
      sudoSlider.goToSlide("next"); 
     }); 

     $("#pages").swipeleft(function() { 
      sudoSlider.goToSlide("prev"); 
     }); 
     }); 
    }); 
</script> 
    </body> 
</html> 

回答

1

雖然我不是一個jQuery Mobile的專家,我想你需要綁定刷卡事件的頁面,就像$("#pages").bind("swipeleft", function() {...});

而且你應該採取看看使用的文檔$(document).bind('pageinit')而不是$(document).ready()

請訪問http://jquerymobile.com/demos/1.2.0/docs/api/events.html並看看第一個黃色框;下面還會解釋刷卡事件。

+0

謝謝。我還注意到,我將綁定放置在關鍵事件中(...) – grrrbytes