如何在滚动时显示我的文本?我找到了这个 http://www.jqueryrain.com/?HZtLD8hN但我想知道它是如何工作的。有人问过类似的问题,但我不明白。有人可以解释或提供示例,说明如何进行这项工作吗?
谢谢
HTML
<div id = "divToShowHide" class = "BeforeScroll">Content i want to appear while scrolling</div>
CSS
.BeforeScroll {
width: 100%;
height: 200px;
background-color: yellow;
}
.AfterScroll {
width: 100%;
height: 200px;
background-color: red;
}
最佳答案
一个基本的例子是这样的:假设您的一些内容在 <div id="appearble_text">
中即页面总高度的 70%。 <div id="container">
最初你会设置document.getElementById("appearable_text").style.display = "none";
可以设置一个函数
function OnScroll() {
var totalHeight = this.offsetHeight; //(this, because container is the caller of the function from the code below)
if (this.scrollTop || this.scrollTop > totalHeight * 0.7) { //if scrolling reached 70% of height
document.getElementById("appearable_text").style.display = "block";
}
}
然后使用它
var container = document.getElementById("container");
container.onscroll = OnScroll;
当然,不是突然显示 <div>
您可以淡入淡出或使用您喜欢的各种 CSS/JQuery 技巧。
关于javascript - 如何在滚动网站时显示我的文字,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34590838/