admin管理员组

文章数量:1379450

please help me to build following logic, here is code:

<button onclick="zoomin()">Zoom In</button>

function zoomin(){
   var myImg = document.getElementById("img");
   var i = 0;
   i++;
   myImg.style.transform = "scale(1."+ i +")";
}

but, because of i = 0 it works only one time. please tell me solution.

please help me to build following logic, here is code:

<button onclick="zoomin()">Zoom In</button>

function zoomin(){
   var myImg = document.getElementById("img");
   var i = 0;
   i++;
   myImg.style.transform = "scale(1."+ i +")";
}

but, because of i = 0 it works only one time. please tell me solution.

Share Improve this question asked Mar 5, 2016 at 9:42 Meghshyam VaishnavMeghshyam Vaishnav 531 silver badge4 bronze badges 1
  • 2 the problem is that every time you run the function, the var i is being set back to 0. Try moving the var i declaration outside of the function. – Matt Greenberg Commented Mar 5, 2016 at 9:45
Add a ment  | 

2 Answers 2

Reset to default 5

Move the variable i out of the function, it needs to be initialised only once.

var myImg = document.getElementById("img");
    var i = 0;
    function zoomin(){


       i++;
       myImg.style.transform = "scale(1."+ i +")";
    }
var i = 0;
var myImg = document.getElementById("img");
function zoomin(){
   i++;
   myImg.style.transform = "scale(1."+ i +")";
}

declare i=0; outside function will solve you probleem

本文标签: Increase transform scale by javascript onclickStack Overflow