ページ内容全体のスケールを変化させる (Safariのみ)

説明

ページ内容全体のスケールを変化させるにはdocument.body.style["-webkit-transform"]に"scale(横倍率,縦倍率)"を設定しますが、この時に少しずつ倍率を変えるようにします。あとはsetInterval()を使って倍率を変化させる処理を定期的に呼び出します。

サンプルプログラム

var pageSize = 4; // 4倍から
var timerID;
document.body.style["-webkit-transform"]="scale("+pageSize+","+pageSize+")";
window.onload = function(){
timerID = setInterval("pageScale()", 25);
}
function pageScale(){
document.getElementById("result").innerHTML = "現在の倍率 : "+pageSize;
pageSize = pageSize - 0.05;
if (pageSize < 1) {
document.body.style["-webkit-transform"]="scale(1,1)";
clearInterval(timerID);
}else{
document.body.style["-webkit-transform"]="scale("+pageSize+","+pageSize+")";
}
}
サンプルを実行
[戻る]