1

jqueryのslideToggle効果を画像に適用すると、画像の異常な動作を発見しました。少し努力して、画像サイズがピクセル（px）で定義されている場合にのみスライド効果が機能することがわかりましたが、サイズがパーセンテージで定義されている場合は機能しません。

HTML

<a>Click Me</a>

<div class='target'>
    Hello Everyone...<br>
    <img src='http://i.imgur.com/MHfCk2B.jpg' height='200px' />
    <img src='http://i.imgur.com/MHfCk2B.jpg' height='10%' width='30%' />
</div>

jQuery

$(document).ready(function() {
    $('body').on('click', 'a', function() {
        $('.target').slideToggle();
    });
})

ここにjsFiddleリンクがあります

一時的な解決策は、代わりに fadeToggle 関数を使用することです。

4

1 に答える 1

1

これは、すべての画像がピクセルの高さで定義されていることを確認するだけで解決されます。これは、実際には動的かつ非常に簡単に実行できるものです。

$("img").height(function (_, h) { return h; });

http://jsfiddle.net/SrWdW/2/

pxまた、 and %in image height/ widthattributes は無効であることも指摘しておく必要があります。

于 2013-01-26T16:06:46.820 に答える