Native method for manual touch scrolling on the mobile side

  var isscrolling, startpos, Endpos; var slider = {//Determine if the device supports touch Event touch: (' ontouchstart ' in window) | | window.            Documenttouch && document Instanceof Documenttouch, slider:document.getElementById (' Sliderbox '), Event events: {index:0,//Index Slider:this.slider of the display element,//this to slid Er object icons:document.getElementById (' Sliderbox '), Icon:document.getElementById (' Sliderbox ') . Getelementsbyclassname (' Swiper-slide '), Handleevent:function (event) {var self = this     ;                    This means the Events object if (Event.type = = ' Touchstart ') {Self.start (event);                    } else if (Event.type = = ' Touchmove ') {Self.move (event);                    } else if (Event.type = = ' Touchend ') {self.end (event);                }                },Swipe to start Start:function (event) {var touch = event.targettouches[0];    Touches array objects get all the touch on the screen, take the first touch startpos = {X:touch.pagex, y:touch.pagey, Time: +new Date};   Take the coordinate value of the first touch isscrolling = 0; This parameter determines whether to scroll vertically or horizontally if (isscrolling = = 0) {this.icons.appendChild (this.icon[0])                    ;                    } this.icons.addEventListener (' Touchmove ', this, false);                This.icons.addEventListener (' Touchend ', this, false);                    },//Mobile Move:function (event) {//When the screen has more than one touch or the page is blocked, do not perform a move operation                    if (Event.targetTouches.length > 1 | | event.scale && event.scale!== 1) return;                    var touch = event.targettouches[0];                    Endpos = {x:touch.pagex-startpos.x, y:touch.pagey-startpos.y}; isscrolling = Math.Abs (ENdpos.x) < Math.Abs (ENDPOS.Y)?    1:0;      Isscrolling is 1 o'clock, indicating longitudinal slide, 0 for transverse sliding if (isscrolling = = 0) {event.preventdefault (); Prevent the default behavior of touch events, that is, block scrolling},//Slide release end:function (event)    {var duration = +new Date-startpos.time; Sliding duration if (isscrolling = = = 0) {//when scrolling horizontally//this.icon[this.index].classnam                        E = ' Prize-box swiper-slide ';  if (number (duration) > 10) {//Determines whether to move left or right, when the offset is greater than 10 o'clock to execute if (endpos.x                            >) {if (this.index!== 0) This.index-= 1;                            } else if (Endpos.x < -10) {if (This.index!== this.icon.length-1) This.index + = 1;                 }} console.log (This.index);       This.icon[0].classname = ' Prize-box swiper-slide first ';                        This.icon[1].classname = ' Prize-box swiper-slide active ';                        This.icon[2].classname = ' Prize-box swiper-slide last ';                    This.icons.style.left =-this.index*600 + ' px ';                    }//Unbind event This.icons.removeEventListener (' Touchmove ', this, false);                This.icons.removeEventListener (' Touchend ', this, false);     }},//Initialize Init:function () {var = this; This refers to the slider object if (!!    Self.touch) Self.slider.addEventListener (' Touchstart ', self.events, false);        AddEventListener The second argument can pass an object that invokes the object's Handleevent property}}; Slider.init ();

　　

Native method for manual touch scrolling on the mobile side