2014-04-27 6 views
3

현재 터치 장치에서 슬라이드간에 좌우로 스 와이프하는 기능을 추가하려고합니다. 나는 http://www.responsiveslides.comhttp://labs.rampinteractive.co.uk/touchSwipe/demosresponsiveslides.js에 터치 스 와이프 추가

두 가지를 모두 수행하는 플러그인이 있다는 것을 알고 있지만, rs의 단순함을 좋아하고 touchSwipe는 정말 편리해 보입니다.

응답 슬라이드에는 manualControls를 사용하여 수동 컨트롤을 사용할 수있는 기능이 있지만 선택기에서만 작동 할 수 있습니다. 스 와이프 이벤트가 발생했는지 여부를 확인할 수 있지만 다음 번 및 이전 트리거에 바인딩하는 방법을 잘 모르겠습니다.

$(function() { 
     $(".rslides").responsiveSlides({ 
      auto: true, 
      pager: false, 
      speed: 400, 
      timeout: 5000, 
      nav: false, 
      prevText: "", 
      nextText: "", 
      navContainer: "", 
      manualControls: function(){ 
       swipeSlides();    
      } 
     }); 

     function swipeSlides(){ 
      $(".rslides").swipe({ 
       swipe:function(event, direction) { 
       console.log("you swiped " + direction); 

       if (direction == "right"){ 
        console.log("right"); 
       } 
       if (direction == "left"){ 
        console.log("left"); 
       } 
      }, 
      threshold:0 
      }); 
     }  
     swipeSlides();   
    }); 

고마워요!

당신은 단지 유사한 문제가 발생하는 사람을 위해, 이미이 문제를 해결했을 수도

답변

0

이 내가

$(".castle-bg").responsiveSlides({ 
    nav: true, 
    pager: true, 
    navContainer: "#pager" 
}); 
$(".castle-bg").swipe({ 
    swipeLeft: function(){ 
     $(".rslides_nav.prev").click(); 
    }, 
    swipeRight: function(){ 
     $(".rslides_nav.next").click(); 
    } 
}); 

했다 그리고 실제 이전 및 다음 버튼을 숨기기 위해 CSS를 사용하는 것입니다