修改FireFox扩展:如果(滚动条存在）var-30，否则var-14

Modify FireFox extension: If (scrollbar exists) var - 30 else var -14

本文关键字：var-30 否则 var-14 存在 滚动条 扩展 FireFox 如果 修改      更新时间：2023-09-26

代码人员您好：）

我是一名前端web开发人员，因此需要不断了解实际视口大小，以便了解响应设计断点的起点和终点。我知道FF自己的"测试窗口大小"功能，但遇到了一个非常方便的扩展：FireSizer。该扩展有一个小缺点：它会返回窗口大小，包括FF的边界和滚动条。不过我需要视口大小。所以我需要破解扩展，但我不知道足够的javaScript。也许有人愿意在这里帮助他们？

我希望扩展能够真正查找滚动条，并从宽度中减去a） 14如果不存在滚动条或b） 30如果滚动条存在

我发现了我认为修改代码的正确位置：

//
// Update the status bar panel with the current window size
//
function FiresizerUpdateStatus() {
    var width  = window.outerWidth  + ''; // <- Think code needs to be edited here
    var height = window.outerHeight + '';
    document.getElementById("firesizer-statuspanel").label = width + 'x' + height;
}

谢谢你的努力！AO-

@陈阿斯拉夫：非常感谢。我不知道有一个元素可以调用文档宽度。我把代码改成了下面的代码，这就成功了（与FF自己的"响应式设计视图模式"相比，它是点开，关了2px——我从clientWidth中减去了这个值。）

function FiresizerUpdateStatus() {
var width  = window.outerWidth  + ''; // changed this line to:
var width  = document.documentElement.clientWidth-2 + '';
var height = window.outerHeight + '';
document.getElementById("firesizer-statuspanel").label = width + 'M' + height;
}

谢谢AO

使用JavaScript 获取浏览器视口尺寸的可能重复

似乎你可以通过使用获得窗口的内部尺寸

// My window is maximized; screen is 1366x768
alert(document.documentElement.clientWidth);
// ^ returns 1349 (17 missing pixels because of scrollbar)
alert(document.documentElement.clientHeight);
// ^ returns 643 (125 pixels missing because of start bar & Chrome toolbars)

然后，您可以将以下内容与您需要的其他内容进行比较（例如，将客户端宽度与窗口宽度进行比较，以确定差异是否足以成为滚动条-只需尝试大小）

相关文章：