3

わかりましたので、onclickでサイズが変更される画像を入れています(大きくなり、onclickで元のサイズに戻ります)

私はJSを使用してこれを行いましたが、サイズ間のトゥイーンにアニメーションを巻き込むようには見えません。

コーディングは次のとおりです。

      <script type="text/javascript">
<!--
var flag = true;
function resize() {
    if(flag) {
        document.getElementById("img1").style.width = "50px";
    } else {
        document.getElementById("img1").style.width = "280px";
    }
    (flag)?flag=false:flag=true;
} 
//-->
</script>

<body onload="resize();">
<img id="img1" src="../images/attachicona.png" border="0" onClick="resize();" />
4

2 に答える 2

2

CSS3 トランジションを使用して、同じ効果を得ることができます。javascript や jquery は不要 - css3 アニメーション/トランジション/トランスフォーム: 画像を大きくするにはどうすればよいですか?

または、jquery アニメーションを使用することもできます - http://forum.jquery.com/topic/image-resize-animation

于 2013-05-28T14:26:32.307 に答える
1

jqueryを使用している場合

var flag = true;
$('#img1').click(function(e){
    if(flag)
        $(e.target).animate({width:'50px'}, 150, function(){
            //do stuff after animation
        });

    else
        $(e.target).animate({width:'280px'}, 150, function(){
            //do stuff after animation
        });
    flag=!flag;
});
于 2013-05-28T14:34:51.627 に答える