複数の画像と HTML マップを含むページで div をズームしようとしています。もちろん、要素と html マップの比率を維持したいと考えています。
JQuery を使用して、必要な CSS プロパティを設定しようとしています。
Chrome では、CSS プロパティ "zoom" が機能しているようです。画像には絶対配置があり、IEでそのようなプロパティが機能しない理由を読んでいます。
だから私はこの方法で CSS 変換を使用しようとしました:
$("#div_name").css("transform" ,"translate(" + x + "px," + y + "px)");
$("#div_name").css("transform" ,"scale(" + zoomVal + "," + zoomVal + ")");
また、マトリックスを使用してみました:
$("#div_name").css("transform","matrix( " + zoom + ", 0 , 0 , " + zoom + " , " + x + " , " + y + " )");
どちらの方法も、Firefox と IE10 (Chrome では機能しません) ではうまく機能しますが、IE9 では機能せず、単に CSS ディレクティブを無視します。
「transform」の代わりに「msTransform」を使用して上記のすべての方法を使用しようとしましたが、成功しませんでした。
私が得た最良の結果は、「msTransform」プロパティで「スケール」プロパティと「変換」プロパティの両方を使用したことです。
このように IE9 は画像をスケーリングしますが、「変換」プロパティを無視しているようです。
IE9 がこの動作をする理由がわかりません。動作させる方法を知りたいです。
前もって感謝します。