檢測是否格是在瀏覽器窗口中可見

Question

我有多個可摺疊的div像這樣

+--------------+ 
| Div 1  | 
+--------------+ 
| Div 2  | 
+--------------+ 
| Div 3  | 
+--------------+ 

現在，當我點擊它擴展

問題的div之一：我如何檢測擴展DIV是在瀏覽器窗口（底部邊框）上展開？

Answer 1

你可以試試這個，這是一個未經測試的想法，因此可能需要進行一些修改。

var div1Height = $("#div1").height(); 
var div2Height = $("#div2").height(); 
var div3Height = $("#div3").height(); 
var windowSize = $(window).height(); 


//assign function for on click (you'll want to change this) 
$("#div1, #div2, #div3").click(function(e){ 
if(div1Height > windowSize){ 
//assuming div1 is at the top 
console.log("div 1 passing extents"); 
} 
if((div2Height + parseInt($("#div2").position().top) > windowSize){ 
console.log("div 2 passing extents"); 
} 
if((div3Height + parseInt($("#div3").position().top) > windowSize){ 
console.log("div 3passing extents"); 
} 

});