style.clip爲空 - 需要知道部分div是否可見

我有一個簡單的div。當瀏覽器（Firefox版本26）窗口縮小時，div的可視區域部分不可見。style.clip爲空 - 需要知道部分div是否可見

我需要找出何時可以看到特定位置（div的右側中間邊緣，例如）何時可見。

讓我驚訝的是，以下產生一個空值 - 沒有字符串，沒有正弦，沒有。無法弄清楚原因。我看到的文檔和示例表明，style.clip應該返回一個字符串，該元素的可見部分的剪切矩形的頂部，右側，底部，左側值爲。

例如，甚至W3schools.com shows that。

這是我的代碼。

window.onresize = function(event) 
{ 
    console.log("Hi, we're about to get the clip rect for myDiv."); 
    console.log("myDiv clip rect is: " + document.getElementById('myDiv').style.clip); 
} 


    <div id="myDiv" style="height: 99%; display: inline-block; width: 99%; 
      background-color: red"></div>

我可以看到div（紅色背景）。但是myDiv的style.clip是空，沒有字符串，什麼也沒有。我的「！DOCTYPE html」位於頁面的頂部。無法弄清楚，儘管可能很簡單。

任何想法？順便說一句：不會在這裏使用任何JavaScript庫，只是純粹的自然JavaScript。

來源

2014-01-30 CFHcoder

如果你沒有設置'rect'風格，沒有什麼可以返回的？我想你只是誤解了這一點，除非你專門設置'rect'風格，否則它不會神奇地返回元素的哪些部分可見。 – adeneo

我想你是說div的一部分在瀏覽器窗口之外 - 換句話說，如果你放大了瀏覽器，div就會完全可見。如果是這種情況，這個線程可能會有所幫助：http://stackoverflow.com/questions/5353934/check-if-element-is-visible-on-screen – BrettFromLA

問題是，當縮小瀏覽器窗口的寬度時，即使瀏覽器窗口的水平滾動條出現，滾動到右側也會產生一個空白區域，即使有數據存在。我通過設置div的硬編碼寬度解決了這個問題 - 也發現我可以編程的方式增加div的寬度，因爲'scrollWidth'增加 - 這兩種方法都有效。

來源

2014-02-08 19:10:32 CFHcoder

style.clip爲空 - 需要知道部分div是否可見

回答

相關問題