JQ滾動條事件
阿新 • • 發佈:2019-02-14
1、對內容區域滾動條滾動的監聽:要放在內容載入的時候
$("#conten").on("scoll",function(){
console.log("滾動了");
})
2、獲取整個內容區域的滾動高度:
$("#content").get(0).scrollHeight
3、區域可見高度
$("#content").height()
4、當前滾動的地方的視窗頂端到整個內容頂端的距離:
var scollH = $("#content").scrollTop();
5、讓滾動條預設在最底下
$('#content').scrollTop( $('#content')[0].scrollHeight );
附上其餘獲取各種高度的程式碼
在IE中:
document.body.clientWidth ==> BODY物件寬度
document.body.clientHeight ==> BODY物件高度
document.documentElement.clientWidth ==> 可見區域寬度
document.documentElement.clientHeight ==> 可見區域高度
在FireFox中:
document.body.clientWidth ==> BODY物件寬度
document.body.clientHeight ==> BODY物件高度
document.documentElement.clientWidth ==> 可見區域寬度
document.documentElement.clientHeight ==> 可見區域高度
?
在Opera中:
document.body.clientWidth ==> 可見區域寬度
document.body.clientHeight ==> 可見區域高度
document.documentElement.clientWidth ==> 頁面物件寬度(即BODY物件寬度加上Margin寬)
document.documentElement .clientHeight ==> 頁面物件高度(即BODY物件高度加上Margin高)
而如果沒有定義W3C的標準,則
IE為:
document.documentElement.clientWidth ==> 0
document.documentElement.clientHeight ==> 0
FireFox為:
document.documentElement.clientWidth ==> 頁面物件寬度(即BODY物件寬度加上Margin寬)document.documentElement.clientHeight ==> 頁面物件高度(即BODY物件高度加上Margin高)
Opera為:
document.documentElement.clientWidth ==> 頁面物件寬度(即BODY物件寬度加上Margin寬)document.documentElement.clientHeight ==> 頁面物件高度(即BODY物件高度加上Margin高)
網頁可見區域寬:
document.body.clientWidth
網頁可見區域高:
document.body.clientHeight
網頁可見區域寬:
document.body.offsetWidth(包括邊線的寬)
網頁可見區域高:
document.body.offsetHeight(包括邊線的寬)
網頁正文全文寬:
document.body.scrollWidth
網頁正文全文高:
document.body.scrollHeight
網頁被捲去的高:
document.body.scrollTop
網頁被捲去的左:
document.body.scrollLeft
網頁正文部分上:
window.screenTop
網頁正文部分左:
window.screenLeft
螢幕解析度的高:
window.screen.height
螢幕解析度的寬:
window.screen.width
螢幕可用工作區高度:
window.screen.availHeight
螢幕可用工作區寬度:
window.screen.availWidth