1.之前我們學習的JS盒子模型中:client系列/offset系列/scrollWidth // scrollHeight都是"只讀"屬性->只能通過屬性獲取值,不能通過屬性修改元素 //的樣式 //
2.scrollTop//scrollLeft:滾動條卷去的高度/寬度(這兩個屬性是唯一"可讀寫") // 我們的scrollTop的值是存在邊界值(最大和最小值的),我們設置的值比最小值小或者比最大值大都沒用,起到效果的依然是邊界值 //最小值是零 // box.scrollTop = -1000;//直接回到了容器的頂部,沒有超出 //console.log(box.scrollTop);// 0 //最大值是=真實高度-當前容器一屏幕的高度 //var maxTop=box.scrollHeight-box.clientHeight // console.log(maxTop);
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
#box{
width: 200px;
height: 200px;
margin: 100px;
border: 10px solid green;
overflow: auto ;
}
</style>
</head>
<body>
<div id="box">
要得到你必須付出,要付出你還要學會堅持,如果你真的覺得很難,那你就放棄,但是你放棄了就不要抱怨,我覺得人生就是這樣,世界真的是平衡的,每個人都是通過自己的努力,去決定自己生活的樣子
要得到你必須付出,要付出你還要學會堅持,如果你真的覺得很難,那你就放棄,但是你放棄了就不要抱怨,我覺得人生就是這樣,世界真的是平衡的,每個人都是通過自己的努力,去決定自己生活的樣子
要得到你必須付出,要付出你還要學會堅持,如果你真的覺得很難,那你就放棄,但是你放棄了就不要抱怨,我覺得人生就是這樣,世界真的是平衡的,每個人都是通過自己的努力,去決定自己生活的樣子
</div>
<script type="text/javascript">
var box = document.getElementById("box");
//1.之前我們學習的JS盒子模型中:client系列/offset系列/scrollWidth
// scrollHeight都是"只讀"屬性->只能通過屬性獲取值,不能通過屬性修改元素
//的樣式
//2.scrollTop//scrollLeft:滾動條卷去的高度/寬度(這兩個屬性是唯一"可讀寫")
// 我們的scrollTop的值是存在邊界值(最大和最小值的),我們設置的值比最小值小或者比最大值大都沒用,起到效果的依然是邊界值
//最小值是零
// box.scrollTop = -1000;//直接回到了容器的頂部,沒有超出
//console.log(box.scrollTop);// 0
//最大值是=真實高度-當前容器一屏幕的高度
//var maxTop=box.scrollHeight-box.clientHeight
// console.log(maxTop);
</script>
</body>
</html>
