4

重複の可能性:
最新のすべてのブラウザでページズームレベルを検出するにはどうすればよいですか?

var obj=document.body;  // obj=element for example body
// bind mousewheel event on the mouseWheel function
if(obj.addEventListener)
{
    obj.addEventListener('DOMMouseScroll',mouseWheel,false);
    obj.addEventListener("mousewheel",mouseWheel,false);
}
else obj.onmousewheel=mouseWheel;

function mouseWheel(e)
{
    // disabling
    e=e?e:window.event;
    if(e.ctrlKey)
    {
        if(e.preventDefault) e.preventDefault();
        else e.returnValue=false;
        return false;
    }
}

私はWebアプリを開発していますが、ユーザーがズームイン/ズームアウトすると、すべてのUI要素が正しい順序になりません。それで、それを防ぐ方法はありますか?私はそれを行うためのいくつかの方法を考えましたが、それは可能ですか?

1)ユーザーの画面解像度を取得します。ウィンドウサイズ(幅または高さ)を変更する場合は、ウィンドウの幅/高さを画面の幅/高さに戻します。

2)マウススクロールイベントまたはキーボードイベントを何にもバインドしません。(上記のデモコードを参照してください)が、ユーザーがブラウザをクリックしてズームインを選択した場合はどうなりますか?

ありがとう

4

1 に答える 1

9
    var zoomlevel=1;

    $("body").dblclick(function(ev) {
        zoomlevel = zoomlevel == 1 ? 2 : 1;



        $(this).css({
            "-moz-transform":"scale("+zoomlevel+")",
            "-webkit-transform":"scale("+zoomlevel+")",
            "-o-transform":"scale("+zoomlevel+")",
            "-ms-transform":"scale("+zoomlevel+")"
        });


    });
于 2012-12-27T08:28:52.993 に答える