3

最近では、すべてのブラウザにユーザーが制御する全ページズームがあると思います。とにかく、html、css、またはjavascriptのいずれかを介して、開発者がアクセスできますか？

iframe、または通常のフレームを提供し、たとえば50％ズームに設定したいと思います。（理想的には、含まれているドキュメントの現在のズームと比較して。）

それはまったく実行可能ですか？既存の機能実装があれば、HTML5ソリューションでもかまいません。ナイトリービルドであっても。

少なくともWebKitとGeckoで動作し、Tridentでも動作する場合は、非常に嬉しいです。

4

4 に答える 4

3

私のために働いているこの HTML5 と CSS3 コードは、IE 6 から 8 へのズームと、残りの最新のブラウザーのスケールの変換です。

#iframe{
    zoom: 0.75;
    -moz-transform: scale(0.75);
    -moz-transform-origin: 0 0;
    -o-transform: scale(0.75);
    -o-transform-origin: 0 0;
    -webkit-transform: scale(0.75);
    -webkit-transform-origin: 0 0; }

Firefox 3.5 以降、Safari 3.1、Chrome 4.0、Opera 10.5 がサポートされています。

xy軸とオフセットに基づいてカスタム構築された関数を備えた古いバージョンのクロスブラウザで動作する、このようなJSまたはJQueryソリューションを探しています。

パスはxy軸関数を使用することだと思いますが、それをシードとして使用するための事前に作成されたズームアウトコードが見つかりません。

于 2011-01-06T02:21:39.783 に答える
2

私が考えることができる最も近いものはZoomCSS3にあります：

div.zoom { zoom: 200%; }

<div class="zoom">
  <p>Hello World</p>
</div>

これは、ifarmeタグに追加するだけでは機能しません。

<iframe id="myFrame" class="zoom" /> <!-- doesn't work -->

BODYまたはwrapper-divのいずれかであるiframeDOM自体のコンテンツタグに適用する必要があります。

それ以外に、クロスブラウザをサポートする素晴らしい方法を見つける方法がわかりません。

于 2009-08-21T00:10:03.593 に答える
2

以下は、Safari 4.0.2 および最新の WebKit nightly で動作します。ただし、Google Chrome (Windows でも Mac でも) では機能しません。

Firefox 3.5 と IE 8.0 に関しては、取り決めはありません。また、最新の Camino nightly の契約はありません。

<style type="text/css" media="screen">
  iframe {
    width  : 500px;
    height : 250px;
  }
</style>

<script type="text/javascript" charset="utf-8">
  function setZoom(element, zoom) {
    element.style.zoom = (zoom || 50) + '%'
  }
</script>

<p>Hello World</p>

<iframe 
  src    = 'http://google.com' 
  onload = "setZoom(this.contentDocument.body)"
  />
于 2009-08-21T00:39:05.550 に答える
1

これは、次のように FF でも実行できます。

iframe {
 -moz-transform: scale(0.5, 0.5); /* 50% */
}

それはうまくいきます！

チェック: https://developer.mozilla.org/en/CSS/-moz-transform

于 2010-09-18T14:50:02.227 に答える