0

iFrameコンテンツの再スケーリングはChromeで機能しますが、他のブラウザでは機能しません。解決策はありますか?フォームを配置するためにiframeを再スケーリングするためのクロスブラウザソリューションが欲しいのですが。

IE8およびFirefox15.0.1では再スケーリングされません。これらのブラウザでは100%で表示されますが、Chromeでは減少します。何かご意見は?

<iframe src="http://www.apple.com/"
frameborder="0" noresize="noresize" scrolling="no"
width="66%" margin: 0 auto; align= "left "seamless="seamless"style="
-webkit-transform:scale(0.5);-moz-transform-scale(0.5);
width: 400px; height: 400px;"></iframe>

http://jsfiddle.net/DisEngaged/t9yhm/

4

1 に答える 1

2

小さなタイプミスをした/Firefoxに間違った構文を使用した。-の代わりにを使用しました:

実例: http: //jsfiddle.net/t9yhm/3/

それ以外の:

-moz-transform-scale(0.5);

そのはず:

-moz-transform:scale(0.5);

また、Firefoxの最新バージョンはプレフィックスなしのバージョンをサポートしていることに注意してください。

transform:scale(0.5);

編集 :

申し訳ありませんが、「クロスブラウザ」ソリューションが必要であることに気づきました。以下のCSS3は、Firefox、Chrome、IE9+の最新バージョンをサポートします。

iframe{
    width: 400px;
    height: 400px;
    margin: 0 auto;
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    transform: scale(0.5);
}

IE8以下の場合、使用できるフィルターがありますが、構文は複雑です。

/* IE8+ - must be on one line*/ 
-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.5, M12=0, M21=0, M22=0.5, SizingMethod='auto expand')";

/* IE6 and 7 */ 
filter: progid:DXImageTransform.Microsoft.Matrix(
        M11=0.5,
        M12=0,
        M21=0,
        M22=0.5,
        SizingMethod='auto expand');

マトリックス値の計算に役立つように、次のサイトを使用できます:http ://www.useragentman.com/IETransformsTranslator/

于 2013-01-21T22:13:27.527 に答える