JQueryでホバー上で画像を拡大する際の問題

Question

コードの束がうまくいくように見えますが、唯一のことは非常に滑らかではないという点だけです。任意のアイデアコードを微調整して効果をより滑らかにする方法は？また、画像が拡大すると、画像の下と横のすべてのコンテンツが押し広げられて拡大の余地を生み出しているように見えますが、これをどのように止めることができますか？また、新しい画像をアップロードしてその効果を望むたびに、各画像にそのコードを挿入するのではなく、javascriptコードを手動で毎回手動で適用するのではなく、新しい画像に自動的に適用する方法はありますか？最後に、画像の代わりにビデオ/ウィジェットでこれをどのように使用すればよいですか？ （私はDreamweaver CS5を使用しています）。

$("img").each(function() { 
$.data(this, 'size', { width: $(this).width(), height: $(this).height() }); 
}).hover(function() { 
$(this).stop().animate({ height: $.data(this,'size').height*1.2, 
width: $.data(this,'size').width*1.2 }); 
}, function() { 
$(this).stop().animate({ height: $.data(this,'size').height, 
width: $.data(this,'size').width }); 
}); 

Answer 1

あなたは画像をリサイズする際、任意の周囲の要素と重複する場合は、画像の相対的、絶対的、または固定され、その後設定z屈折率のいずれかの要素を配置するためにCSSでプレイする必要があります値は周囲の要素よりも高い。

Answer 2

jQueryライトボックスプラグインを調べる必要があると思われます。拡大されたイメージの特定の問題については、あなたのコンテンツをプッシュして、ドキュメントフローから（position属性を使用して）削除する必要があります...それはちょうど氷山の先端です。あなたが達成しようとしている作業には、多くの可動部分があります。そのため、既存のJavaScriptプラグインを使用するのが最善です - もちろんIMOです。

http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/とhttp://line25.com/articles/rounding-up-the-top-10-jquery-lightbox-scriptsをチェックしてください。