jQueryの簡易画像拡大効果サンプルコード_jquery

DEMO 円形の絵をクリックして、下のレイヤーに水の絵を配置します。マウスを上に動かすと、絵の高さと幅が比例して増加し、絵が左上に移動します。

コード

コードをコピー コードは次のとおりです:

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