javascript - div の内容をパーセンテージでスケーリングしますか?

Question

ユーザーがボックス内を移動してページレイアウトを作成できる種類の CMS を構築する (とにかく基本的な考え方)。

データベースから実際のコンテンツを取得して「ページ」を作成したいのですが、50% の縮尺で表示します。

実際の前面ページ用と管理ツール用の 2 セットの CSS を使用して、それに応じてすべてを縮小することもできますが、維持するのは面倒です。

ある種の jquery や CSS、または div に入力して 50% スケールのプロパティ (?) を与えることができる何かがあることを望んでいました。

score 153 · Accepted Answer

zoomプロパティを使用するだけです。

#myContainer{
    zoom: 0.5;
    -moz-transform: scale(0.5);
}

myContainer には、編集中のすべての要素が含まれています。これは、すべての主要なブラウザでサポートされています。

score 31 · Accepted Answer

このクロスブラウザ lib はより安全に思えます - ただ zoom と moz-transform は jquery.transform2d の scale() ほど多くのブラウザをカバーしません。

例えば

$('#div').css({ transform: 'scale(.5)' });

アップデート

OK - 人々が説明なしにこれに反対票を投じているようです。ここでのもう 1 つの回答は、古い Safari (Tiger を実行している人々) では機能せず、一部の古いブラウザーでは一貫して機能しません。他のブラウザと一致しない方法での要素の位置。

または、この質問を見てください。これはおそらくだまされたものです。