mouse 이벤트를 touch 이벤트로 바꿨는데 안드로이드에서 작동이 않됩니다.
본문
mouseup mousedown mousemove를 touch로 바꿨는데 IOS에서는 되는데 안드로이드에서는 작동이 않됩니다.
어디를 고쳐야 안드로이드에서도 작동이 될지요?
<script>
var carousel = $('#carousel1'),
threshold = 150,
slideWidth = 90,
dragStart,
dragEnd,mflag=0;
$('#slidenext').click(function(){ shiftSlide(-1) })
$('#prev').click(function(){ shiftSlide(1) })
$(document).on('touchend', function(){
mflag=0;
carousel.off('touchend');
carousel.off('touchmove').removeClass('transition');
$(document).off('touchend');
})
carousel.on('touchstart', function(){
mflag=1;
if (carousel.hasClass('transition')) return;
dragStart = event.pageX;
$(this).on('touchmove', function(e){
dragEnd = e.pageX || e.originalEvent.touches[0].pageX;
$(this).css('transform','translateX('+ dragPos() +'px)')
})
$(document).on('touchend', function(){
if (dragPos() > threshold) { return shiftSlide(1) }
if (dragPos() < -threshold) { return shiftSlide(-1) }
shiftSlide(0);
})
});
function dragPos() {
return dragEnd - dragStart;
}
function shiftSlide(direction) {
if (carousel.hasClass('transition')) return;
dragEnd = dragStart;
$(document).off('touchend')
carousel.off('touchmove')
.addClass('transition')
.css('transform','translateX(' + (direction * iw) + 'px)');
setTimeout(function(){
if (direction === 1) {
$('.slide:first').before($('.slide:last'));
} else if (direction === -1) {
$('.slide:last').after($('.slide:first'));
}
carousel.removeClass('transition')
carousel.css('transform','translateX(0px)');
},700)
}
</script>