修改Firefox擴展：如果（滾動條存在）VAR - 30變種別的-14

你好老鄉代碼的人:)修改Firefox擴展：如果（滾動條存在）VAR - 30變種別的-14

我是一個前端Web開發人員，因此需要實際的視口大小不變的知識，以便查看響應式設計斷點的起點和終點。我知道FF自己的'測試窗口大小'功能，但遇到了一個非常方便的擴展：FireSizer。該擴展有一個缺點：它給出了窗口大小，包括FF的邊框和滾動條。我需要視口大小。所以我需要擴展黑客，但不知道足夠的javaScript來這樣做。也許有人願意幫助他們在這裏？

我很想擴展到實際上看起來的滾動條，並從寬度一）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

@Chen Asraf：非常感謝你。我不知道有一個元素可以調用文檔寬度。我改變了代碼以下，並且該訣竅（也相比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

來源

2013-08-25 RockScientist01

可能重複[Detect if一個頁面有一個垂直滾動條？]（http://stackoverflow.com/questions/2146874/detect-if-a-page-has-a-vertical-scrollbar） – user123444555621

的Get the browser viewport dimensions with 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)

然後，您可以將以下內容與您需要的任何內容進行比較（例如，將客戶端寬度與窗口寬度進行比較，以查找差異是否足夠大以成爲滾動條 - 僅嘗試使用大小）

來源

2013-08-25 13:19:07 casraf

修改Firefox擴展：如果（滾動條存在）VAR - 30變種別的-14

回答

相關問題