peachananr / onepage-scroll

Create an Apple-like one page scroller website (iPhone 5S website) with One Page Scroll plugin
http://peachananr.github.io/onepage-scroll/Demo/demo.html
9.54k stars 2.06k forks source link

About touch on iPhone,iPad... #183

Open makersunion opened 10 years ago

makersunion commented 10 years ago

add 'event.preventDefault(); ' to touchmove(event) function touchmove(event) { var touches = event.originalEvent.touches; if (touches && touches.length) { var deltaX = startX - touches[0].pageX; var deltaY = startY - touches[0].pageY;

                if (deltaX >= 50) {
                    $this.trigger("swipeLeft");
                }
                if (deltaX <= -50) {
                    $this.trigger("swipeRight");
                }
                if (deltaY >= 50) {
                    $this.trigger("swipeUp");
                }
                if (deltaY <= -50) {
                    $this.trigger("swipeDown");
                }
                if (Math.abs(deltaX) >= 50 || Math.abs(deltaY) >= 50) {
                    $this.unbind('touchmove', touchmove);

// $this.unbind('touchend', touchend); } } event.preventDefault(); } Now , touch device can sroll and button can click.

discsox commented 10 years ago

Thank you very much. Incorporating this change made the JS work on Apple touch devices! it should definitely be added to the core code. Cheers,

Marcello

erin-dot-io commented 9 years ago

Thank you for this!

Just to note: the pure js version of this plugin does not suffer from this problem.