Finish the effect:
The effect can only be shown on your phone, and you can use the UA in Chrome developer tools to simulate your phone.
<pre name= "code" class= "HTML" ><! DOCTYPE html>
Reference Blogbackground: Mobile browser does not support jquery's Mousedown,mousemove,mouseup event, want to write with jquery, but Baidu later found that jquery does not support mobile phone gesture swipe method. Finally found the above blog to solve the problem.
<span style= "color: #ff0000;" >nav_widthx = Document.body.clientWidth; Get the viewable area width </span>
<span style= "Color:rgb (255, 0, 0); Font-family:arial, Helvetica, Sans-serif; >max_width = (Tag_num * 60-nav_widthx + 100) *-1; Get left slip maximum distance </span>
The code above is designed to control the maximum distance left when sliding to the far right, and will not let the menu disappear.
Deficiencies:
<span style= "color: #ff0000;" >document.getelementbyid ("Head"). AddEventListener (' Touchstart ', Touchstart);d Ocument.getelementbyid ("Head"). AddEventListener (' Touchmove ', touchmove);d Ocument.getelementbyid ("Head"). AddEventListener (' Touchend ', function () {ismove = false;}); </span>
<span style= "color: #ff0000;" ></span><pre name= "code" class= "HTML" style= "FONT-SIZE:18PX;" ><span style= "color: #ff0000;" >TX = parseint ($ ("#head"). CSS (' left '));//This place also needs to be changed </span>
element binding events are cumbersome and do not know how to write to make the call as simple as possible. Because there's more than one part of the page that you want to swipe. Finally, call it like this: $ (". Head"). drag ();
Have to know how to write must tell me AH ~ ~
Use JavaScript for touchmove effects on your phone