具体的には、自社のサイトを表示するときは自動で1サイズ小さく表示するようにさせたいと思っています。
できません。
画面の拡大・縮小機能はブラウザ固有の機能で、HTMLやJavaScriptで定義されていないためです。
代替策として、HTML5のiframeにtransformを組み合わせることで、フレーム内の表示ページを拡大・縮小することはできます。
WEBサーバーの振り分け機能は今回の要求にはそぐわないです。
デザインを担当するのはcssなので、
サイト全体のデザインを統括して便利に管理していきたい場合には、
カスケードスタイルシートをいくつかの段階に分けて用意しておくことで対応します。
レベル1:サイトの全てのページが基本にする共通のスタイルシート。
レベル2:サイト内をいくつかのグループに分ける場合は、グループ内で共通のスタイルシート。
レベル3:いくつかのページで使いまわしたいスタイルシート。
レベル4:特設ページなど、どうしてもそのページだけ変えたい場合のスタイルシート。
(なお、レベル分けはサイト構成によりますので、この限りではありません。)
今回の質問は自社のサイトということですから、
サイト内の全てのページからリンクするスタイルシートを用意することになります。
(以前の質問で出ていたwordpressならばテーマのcommon.cssが相当します。)
例として次の2つを挙げておきます。
(a)文字だけを対象にする場合は意外と簡単です。
文字サイズを相対指定で行えば良いです。
xx-small/x-small/small/medium/large/x-large/xx-large
一段小さくしたい場合はsmallを用います。
古くからある機能なのでブラウザ依存の心配はしなくても良いです。
* { font-size:small }
(b)画像を含めた拡大・縮小はIEだけの独自機能です。
IEであればzoomというcssが使えます。他のブラウザでは無視されます。
body { zoom:0.8 } ←数値指定 body { zoom:80% } ←パーセント指定 body { zoom:normal } ←標準
javascriptでできますし、cssでも擬似的にできるようです。
http://www.sun-inet.or.jp/usr/reirou/public_html/javascript/java017.htm
http://jsdo.it/edo_m18/xW07
こちらが参考になります
http://osima.jp/blog/js-getBrowserWidth/index.html
参照元
http://questionbox.jp.msn.com/qa4941260.html
ちなみにウインドウサイズに合わせてCSSを変えるレイアウト方法もあります
http://coliss.com/articles/build-websites/operation/css/different-stylesheets-for-differently-sized-browser-windows.html
http://css-tricks.com/examples/ResolutionDependantLayout/example-two.php
コメント(0件)