Wednesday, 25 September 2013

Error moving jQuery slider with iScroll5 beta

Error moving jQuery slider with iScroll5 beta

I'm working on iScroll5 Beta. I want to make a magazine style mobile webpage.
http://bit.ly/1b7FQco
When I swipe left or right, it works well and slider would move to right
position. But there is a problem. When I drag a slider point on bottom
bar, "scrollTo(-320 * e.target.value, 0, 500);" is works well. And then I
swipe up and down on color page, unsuspected page would be shown. I'm not
good at writing English. So I made a movie when I swipe it.
Swipe Error You Tube File
http://www.youtube.com/watch?feature=player_detailpage&v=4P5N0r_dKyg
After watching this video, you would know what the problem is.
Here's codes.
Script
var myScroll;
function loaded () {
myScroll = new IScroll('#wrapper', {
scrollX: true,
scrollY: false,
momentum: false,
snap: true,
snapSpeed: 400,
tap: true,
click: true
});
myScroll.on("scrollEnd", function() {
$('#slider-1').val(myScroll.currentPage.pageX);
});
$('#slider-1').bind('mouseup', function(e) {
myScroll.scrollTo(-320 * e.target.value, 0, 500);
myScroll.x = -320 * e.target.value;
myScroll.currentPage.x = -320 * e.target.value;
myScroll.currentPage.pageX = e.target.value;
});
}

No comments:

Post a Comment