1、如何判斷一個元素是否出現(xiàn)在窗口可視范圍（瀏覽器的上邊緣和下邊緣之間，肉眼可視）。寫一個函數(shù) isVisible實現(xiàn)
function isVisible($img) {
var scrollTop = $(window).scrollTop()
var windowHeight = $(window).height()
var offsetTop = $img.offset().top
if (offsetTop < scrollTop + windowHeight && offsetTop > scrollTop) {
return true
}
return false
}
2祠饺、當窗口滾動時，判斷一個元素是不是出現(xiàn)在窗口可視范圍汁政。每次出現(xiàn)都在控制臺打印 true 道偷。用代碼實現(xiàn)
$(window).on('scroll', function() {
if(isVisible($elem)) {
console.log('true')
}
})
function isVisible($node) {
var nodeT = $node.offset().top
var nodeH = $node.outerHeight()
var windowH = $(window).height()
var scrollT = $(window).scrollTop()
if(nodeT + nodeH > scrollT && nodeT < windowH + scrollT) {
return true
}
return false
}
3、當窗口滾動時烂完，判斷一個元素是不是出現(xiàn)在窗口可視范圍试疙。在元素第一次出現(xiàn)時在控制臺打印 true，以后再次出現(xiàn)不做任何處理抠蚣。用代碼實現(xiàn)
var hasVisible = false
$(window).on('scroll', function() {
if(hasVisible) {
return
}
if(isVisible($elem)) {
hasVisible = true
console.log('true')
}
})
function isVisible($node) {
var nodeT = $node.offset().top
var nodeH = $node.outerHeight()
var windowH = $(window).height()
var scrollT = $(window).scrollTop()
if(nodeT + nodeH > scrollT && nodeT < windowH + scrollT) {
return true
}
return false
}
4祝旷、圖片懶加載的原理是什么？
a)對于所有圖片img標簽把真實的地址放入自定義屬性data-src中
b)當頁面滾動時嘶窄，檢查頁面所有的img標簽怀跛，看看這個標簽是否出現(xiàn)到我們的視野，當初出現(xiàn)在我們的視野中時柄冲，再去判斷他是否加載過吻谋，如果沒有加載，加載他现横。
