jQuery简易图片放大特效示例代码_jquery

DEMO点击圆形图片，图片方法，将水的图片放置与下层，鼠标移上去的时候，图片高与宽同比增大，并且图片向左上移动

代码

复制代码 代码如下:

<script> <BR>$(document).ready(function(e) { <BR>$(".water1").mouseover(function(){ <BR>$("#img1").stop(true,true).animate({top:"-32.5px",left:"-32.5px", width:"400px",height:"400px"},"slow"); <BR>$("#img2").stop(true,true).animate({top:"-10px",left:"-10px", width:"115px",height:"115px"},"slow"); <BR>$("#img3").stop(true,true).animate({top:"-4px",left:"-4px", width:"41px",height:"41px"},"slow"); <BR>}) <BR>$(".water1").mouseout(function(){ <BR>$("#img1").stop(true,true).animate({top:"0px",left:"0px",width:"335px",height:"335px"},"slow"); <BR>$("#img2").stop(true,true).animate({top:"0px",left:"0px", width:"95px",height:"95px"},"slow"); <BR>$("#img3").stop(true,true).animate({top:"0px",left:"0px", width:"33px",height:"33px"},"slow"); <BR>}) <BR>}); <BR></script>