2012-10-29 4 views
0

스 와이프 지원을 SudoSliderJquery Mobile을 통해 추가하려고 시도했지만 지금까지 작동하지 않는 것 같습니다. ipad와 아이폰에 둘 다 훔쳐 볼 때 아무 일도 일어나지 않습니다. 내 페이지의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와 모바일 전문가가 아니라고하지만, 나는 또한 $("#pages").bind("swipeleft", function() {...});

수행해야처럼, 당신은 페이지에 슬쩍 이벤트를 바인딩 할 필요가 있다고 생각 문서를보고 $(document).ready()

http://jquerymobile.com/demos/1.2.0/docs/api/events.html을 방문하여 첫 번째 노란색 상자를 살펴보십시오. 스 와이프 이벤트도 아래에 설명되어 있습니다.

+0

고마워요. 나는 또한 내 바인딩을 keyup 이벤트 (...) 내에 배치했다. – grrrbytes

관련 문제