3

私は自分が求めている機能でフィドルを設定しましたが、画像の幅がパーセンテージベースの場合に同じ結果を達成する方法がわかりません。

http://jsfiddle.net/bs8Tw/

$('img').click(function() {

    var toggleWidth = $(this).width() == 350 ? '700px' : '350px';

    $('img').animate({ width: '350px' });
    $(this).animate({ width: toggleWidth });

});

ご覧のとおり、画像をクリックすると幅が2倍になります。もう一度クリックすると、通常のサイズに戻ります。ただし、ここで重要なのは、ある画像をクリックしてから別の画像をクリックすると、最初の画像が通常のサイズに戻ってから2番目の画像が大きくなることです。

基本的に、私はこの正確な機能を探していますが、画像の幅を50％と100％の間で切り替えたいと思います。

4

1 に答える 1

4

あなたの質問は、「幅が 50% かどうかを判断するにはどうすればよいか」ということだと思います。とても簡単です: コンテナの幅の 50% かどうかを確認するだけです。実際、それ以外の場合は幅の 100% になるため、コンテナーの幅の 60% 未満であるかどうかを確認するだけです。

var toggleWidt = $(this).width() < $(this).parent().width() * .6 ? '100%' : '50%'

これは、「コンテナ」が画像に必要な最大サイズであることを前提としていますが.closest、親よりも上位にある場合はいつでも使用できます。

http://jsfiddle.net/bs8Tw/2/

于 2013-02-20T22:09:22.583 に答える