我正在嘗試在我的網站上創建一個終端/控制臺。我找到了使用 javascript 在頁面上向下滾動的函式，它們是window.scrollTo(0,document.body.scrollHeight);和window.scrollTo(0,document.querySelector(".fakeScreen").scrollHeight)。但是，我無法使它們都起作用。我把它們放在不同的地方；在我的writeText函式底部和我的每個函式中，但是沒有一個起作用。
![自動滾動到頁面底部不起作用 [javascript]](https://img.uj5u.com/2021/10/18/c17acf046857493c8547983c0051a0b7.gif)
嘗試一（writeText 函式）：
function writeText(data) {
output.innerHTML = `${data}<br>`;
window.scrollTo(0,document.body.scrollHeight);
}
嘗試兩個（在我的每個函式中）：
function whoami() {
writeText(`
<br>
hi! i'm gxzs, bla bla bla..
<br>`)
window.scrollTo(0,document.body.scrollHeight);
}
CSS（終端，滾動條）
.terminalScreen {
background-color: #282828;
opacity: 90%;
box-sizing: border-box;
position: relative;
width: 100%;
height: 100%;
overflow-y: scroll;
width: 1500px;
height: 800px;
margin: 0 auto;
padding: 20px;
vertical-align: center;
}
.terminalScreen::-webkit-scrollbar {
width: 12px;
}
.terminalScreen::-webkit-scrollbar-track {
background: #282828;
}
.terminalScreen::-webkit-scrollbar-thumb {
background-color: #141414;
border-radius: 15px;
border: 3px solid #282828;
}
.terminalScreen .output {
width: 100%;
color: #fff;
font-size: 14pt;
font-family: 'Roboto Mono', monospace;
}
uj5u.com熱心網友回復：
在window您的目標物件是window由瀏覽器，而不是終端視窗暴露物件。
要滾動終端滾動條，您需要使用終端內的滾動條定位元素。像這樣：
document.querySelector(".terminalScreen").scrollTo(0, document.body.scrollHeight)
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/322085.html
標籤：javascript html css 滚动
上一篇：導航欄中的HTML幻燈片錯誤位置