js,图片放大缩小

    var img = document.getElementsByTagName('img')[0];//图片元素

    img.onclick =function(){

//图片点击事件

        var imgH = img.height; //获取图片的高度

        var imgW = img.width; //获取图片的宽度

        if (imgW ==200 & imgH ==200) {

img.style.height =800 +'px';

            img.style.width =800 +'px';

        }else {

img.style.height =200 +'px';

            img.style.width =200 +'px';

        }

}



 var flag = true,//状态true为正常的状态,false为放大的状态

           imgH,//图片的高度

           imgW,//图片的宽度

           img = document.getElementsByTagName('img')[0];//图片元素

  img.onclick =  function(){

      //图片点击事件

       imgH = img.height; //获取图片的高度

       imgW = img.width; //获取图片的宽度

       if(flag){

           //图片为正常状态,设置图片宽高为现在宽高的2倍

           flag = false;//把状态设为放大状态

           img.height = imgH*2;

           img.width = imgW*2;

       }else{

           //图片为放大状态,设置图片宽高为现在宽高的二分之一

           flag = true;//把状态设为正常状态

           img.height = imgH/2;

           img.width = imgW/2;

       }


   }

你可能感兴趣的:(js,图片放大缩小)