hammer.js 동작을 안합니다.

[김건우]

 

<div style="overflow: hidden; position:relative">
<div class="slide-container">
<div class="slide-box">
<img src="img/1.jpg">
</div>
<div class="slide-box">
<img src="img/2.jpg">
</div>
<div class="slide-box">
<img src="img/3.jpg">
</div>
</div>
<button class="slide-prev">Prev</button>
<button class="slide-next">Next</button>
</div>

<script>
var 이미지1 = document.querySelectorAll('.slide-box img')[0];

var 매니저 = new Hammer.Manager(이미지1);
매니저.add(new Hammer.Pan({ threshold: 0 }));

매니저.on('pan', function(e){
$('.slide-container').css('transform', 'translateX(' + e.deltaX + ')' );
});

</script>

 

hammer.js , 제이쿼리는 모두 설정되있습니다.

console.log(e.deltaX); 를 하면 좌표값도 콘솔창에 잘뜹니다.

그런데도 동작을 안하네요 ... 

무슨문제가 있는건가요 

 

[codingapple]

‘transform’, ‘translateX(이동한거리)' 이렇게 쓰지말고

‘transform’, ‘translateX(이동한거리px)' 이렇게 씁시다 

[김건우]

와 천재시네 ... 

[글쓴이]

글