||| Tips ||

Tips

スクリーン解像度に合わせたフォントサイズでページを表示する

実行例

画面解像度900を境にフォントサイズとカラーが変わります．画面解像度を変えてリロードしてみて下さい

説明

スクリーン解像度800x600と1600x1200の環境、各々に適切なフォントサイズでページを表示させることは可能でしょうか．このスクリプトはuserAgentでクライアントのスクリーン解像度を調べ、各環境に合わせてスタイルシートを切替えます．スタイルシートが働かないブラウザーでは使えません．

ソース

<script type="text/JavaScript">
<!--
//スクリーン解像度に合わせて文字の大きさを変える
reso=800;
//ブラウザーがバージョン４以降であるか判別
uag=navigator.userAgent;
if(uag.indexOf('Mozilla/3.')<0){
    reso=screen.width;    //スクリーンサイズを取得
    if(reso>900){
        mycss='highreso.css';
    }else{
        mycss='lowreso.css';
    }
    document.write("<LINK REL=STYLESHEET HREF='"+mycss+"' TYPE='text/css'>");
}else{
    alert("このブラウザでは画面解像度が取得できません");
}
</script>

PAGETOP