imgSlider
imgSlider copied to clipboard
demo doesn't work on my Android 4.2 phone
The touch events are having no effect on the slider.
@joyously Could you please provide any more details? I'm assuming you are trying it here. It works as expected on all android devices i tested on including
I've attached a screenshot from my phone. You can see that the instruction text is gone, because I touched the image. But it does not move the bar or change in any other way. I'm using the stock browser on Android 4.2 and javascript is enabled. What other details can I provide? I tried it on my friend's Android 4.4 phone and it worked fine.
Hi, awesome plugin, I see touch events are enabled, but this is not working with any touch device. Were you able to fix this lately? I'm looking into it myself but I can't detect the issue. Thanks
Replacing
var slideResize = function (e) {
e.preventDefault();
//hide instructions
$(e.currentTarget).children('.instruction').hide();
var width;
if(e.type.startsWith('touch')){
width = e.originalEvent.touches[0].clientX - e.originalEvent.layerX;
} else {
width = e.offsetX === undefined ? e.pageX - e.originalEvent.layerX : e.offsetX;
}
if (width<=$(this).width()){
$(this).find('.left.image').css('width', width + 'px');
}
};
with
var slideResize = function (e) {
e.preventDefault();
//hide instructions
$(e.currentTarget).children('.instruction').hide();
var width;
if(e.type.startsWith('touch')){
width = e.originalEvent.touches[0].clientX - this.offsetLeft;
} else {
width = e.offsetX === undefined ? e.pageX - e.originalEvent.layerX : e.offsetX;
}
if (width<=$(this).width()){
$(this).find('.compare_left.compare_image').css('width', width + 'px');
}
};
should fix the issue on mobile.
Thanks!