在JavaScript中捕获浏览器的“缩放”事件

当用户更改页面缩放时,是否可以使用JavaScript检测? 我只想捕捉一个“缩放”事件并对其作出响应(类似于window.onresize事件)。

谢谢。


没有办法主动检测是否有缩放。 我在这里找到了一个关于如何尝试实现它的好条目。

我发现了两种检测缩放级别的方法。 检测缩放级别更改的一种方法依赖于百分比值未缩放的事实。 百分比值与视口宽度有关,因此不受页面缩放的影响。 如果您插入两个元素,一个位置以百分比表示,另一个以像素为相同位置,则当页面缩放时,它们会分开。 找到两个元素的位置之间的比例,并且您已经获得了缩放级别。 见测试用例。 http://web.archive.org/web/20080723161031/http://novemberborn.net/javascript/page-zoom-ff3

你也可以使用上述帖子的工具来完成。 问题是你或多或少会对网页是否缩放进行有根据的猜测。 这在某些浏览器中会比其他浏览器更好。

如果在缩放时加载页面,则无法判断该页面是否缩放。


我正在使用这段JavaScript来对缩放“事件”做出反应。
它轮询窗口宽度。 (如本页所述(伊恩埃利奥特链接):http://novemberborn.net/javascript/page-zoom-ff3 [archive])

测试Chrome,Firefox 3.6和Opera,而不是IE。

问候,马格努斯

var zoomListeners = [];

(function(){
  // Poll the pixel width of the window; invoke zoom listeners
  // if the width has been changed.
  var lastWidth = 0;
  function pollZoomFireEvent() {
    var widthNow = jQuery(window).width();
    if (lastWidth == widthNow) return;
    lastWidth = widthNow;
    // Length changed, user must have zoomed, invoke listeners.
    for (i = zoomListeners.length - 1; i >= 0; --i) {
      zoomListeners[i]();
    }
  }
  setInterval(pollZoomFireEvent, 100);
})();

这适用于我:

        var deviceXDPI = screen.deviceXDPI;
        setInterval(function(){
            if(screen.deviceXDPI != deviceXDPI){
                deviceXDPI = screen.deviceXDPI;
                ... there was a resize ...
            }
        }, 500);

它只在IE8上需要。 所有其他浏览器自然会生成一个resize事件。

链接地址: http://www.djcxy.com/p/83317.html

上一篇: Catch browser's "zoom" event in JavaScript

下一篇: Getting table id