<分区>
我正在尝试为本地管道公司创建一个单页可滚动网站。我有一个想法需要像 :
这样的效果任何人都可以为这个“水流过管道”的概念推荐任何 JS/Jquery 插件吗？
<分区>
我正在尝试为本地管道公司创建一个单页可滚动网站。我有一个想法需要像 :
这样的效果任何人都可以为这个“水流过管道”的概念推荐任何 JS/Jquery 插件吗？
最佳答案
嗯，这主要是使用 CSS3 而不是 JavaScript 效果来实现的。您可以编写一个脚本，将触发特定 CSS 事件与滚动功能结合起来，例如 parallax effect以及在 this fiddle 上看到的效果.
CSS 代码因为我不能post the link as is :
CSS
#progressbar {
background-color: black;
border-radius: 8px;
padding: 3px;
width: 400px;
}
#progressbar div {
background-color: #0063C6;
width: 50%;
height: 10px;
border-radius: 5px;
animation:loadbar 2s;
-webkit-animation:loadbar 2s;
}
@keyframes loadbar {
0% {
width: 0%;
}
100% {
width: 50%;
}
}
@-webkit-keyframes loadbar {
0% {
width: 0%;
}
100% {
width: 50%;
}
}
HTML
<div id="progressbar">
<div></div>
关于javascript - jquery水流过管道效果，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21363237/