Mobile viewport related events

Ban default event:

When the mobile terminal development, there will be a lot of default events, usually you need to ban all default event.

document.addeventListener(“touchstart”,function(e){
    e = e || event;
    e.preventDefault();
})

Mobile end popular event is touchstart (finger touch), touchmove (finger sliding), touchend (finger lift)

While the default ban time, it will also label all of a ban.

A re-open tab, and prevents inadvertently

var aNode = document.querySelectorAll("a");
for (var i=0;i<aNode.length;i++) {
         aNode[i].addEventListener("touchstart",function(){
                   this.isMoved=false;
         })
         aNode[i].addEventListener("touchmove",function(){
                   this.isMoved=true;
         })
         aNode[i].addEventListener("touchend",function(){
                   if(!this.isMoved){
                            location.href=this.href;
                   }
         })
}

About arguments:

arguments in the function parameters: Meaning changedTouches, targetTouches, touches represented

changedTouches: trigger finger a list of current events.

targetTouches: trigger finger a list of elements of the current event.

touches: a list of the screen when the trigger current event finger.

The most commonly used is changedTouches.

changedTouches returns the current event trigger finger touch points.

targetTouches returns remain in the finger touching the element after the trigger point of the current event.

touches: returns remain in the finger touches the screen after the trigger point of the current event.

These three are arrays.

Gets the position of the sliding finger:

div.addEventListener("touchstart",function(){
})
// touchMove not trigger separate 
div.addEventListener ( "touchMove", function (E) {
         e=e||event;
         var touch = e.changedTouches[0];
         div.innerHTML=touch.clientX+"<br>"+touch.clientY;
})

 Reset style mobile terminal:

{A -webkit-TAP-highlight- Color: transparent;} // mobile terminal unique clicking highlight effect 
INPUT { -webkit- Appearance: none;} // moving end button provided not display properly rounded 
<meta name = " Detection-the format "Content =" telephone = NO, NO = In email "> // Meta tags are prevented by mail and telephone identify the mobile terminal