Hammer double tap function ...

Question

It works onload and doesn't work again.. Is there a way to re-run the function to work everytime I double tap to zoom in and double tap to zoom out?

var element = document.querySelector('#box_content').firstChild;
            Hammer(element).on("doubletap", function(){
              if(element.getAttribute("width") === "320"){
              element.setAttribute("width", "600");


             Hammer(element).on("doubletap", function() {          
                if(element.getAttribute("width") === "600"){
                element.setAttribute("width", "320");                   

               }
            }, false);

               }
          },false);

Answer 1

I have no idea what Hammer is, however, it looks like you're adding a doubletap event everytime you double tap, which, in essence is repeatedly setting your width to "600" then back to "320" in a loop.

Instead, have only one listener, that checks the current value of width, and does the appropriate action:

Hammer(element).on("doubletap", function(){
  if(element.getAttribute("width") === "320")
    element.setAttribute("width", "600");
  else if(element.getAttribute("width") === "600")
    element.setAttribute("width", "320");
},false);