0

jqueryを使用して画像のサイズを変更するにはどうすればよいですか?

<td align="center"><img width="150px" src="{{=URL(r=request, f='download', args=Product.image)}}" AlT="no picture provided"/></td>

画像は forloop を使用してデータベースから直接読み込まれ、画面に表示されます。

私が達成したいのは、クリックしたときに画像のサイズを大きくすることだけです。http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_animation1_relativeのようなものです が、画像を増やし続けるべきではありません。

4

2 に答える 2

1

これが私のフィドルです。簡単です。何度も増やさないコツはこんな条件です。

if (img.width() < 200)

フィドルのコード:

<!-- Html -->

<img id="mrbean" src="http://2.bp.blogspot.com/-C6KY8tsc8Fw/T-SVFnncxjI/AAAAAAAAANw/FMiNzA8Zecw/s640/mr.bean.jpg" width="50" height="50" />

<input type="button" value="Increase image size" />

// JavaScript
$("input").click(function() {
    var img = $("#mrbean");

    if (img.width() < 200)
    {
        img.animate({width: "200px", height: "200px"}, 1000);
    }
    else 
    {
        img.animate({width: img.attr("width"), height: img.attr("height")}, 1000);
    }
});

2 回目のクリックで画像のサイズを元のサイズに戻すようにフィドルを更新しました。

于 2013-10-09T17:25:31.070 に答える