html中点击照片时放大缩小 基于jquery实现一张图片点击鼠标放大再点缩小

. 代码如下:

var isopen = false;

var newImg;

var w = 200; //将图片宽度+200

var h = 200; // 将图片高度 +200

$(document).ready(function(){

$("img").bind("click", function(){

newImg = this;

if (!isopen)

{

isopen = true;

$(this).width($(this).width() + w);

$(this).height($(this).height() + h);

moveImg(10, 10);

}

else

{

isopen = false;

$(this).width($(this).width() - w);

$(this).height($(this).height() - h);

moveImg(-10, -10);

}

});

});

//移位

i = 0;

function moveImg(left,top)

{

var offset = $(newImg).offset();

$(newImg).offset({ top: offset.top + top, left: offset.left + left});

if (i == 10)

{

i =0;

return;

}

setTimeout("moveImg("+left+","+top+")", 10);

i++;

}