我正在努力组建一个投资组合网站.它很顺利,但我真的很粗暴.
我正在使用一个页面,到目前为止已经制作了四个div来分解我的工作.当用户滚动时,我将从一侧或另一侧进入图形设计件.
现在,我发现WOW.js应该完全符合我的要求,即.只有当用户向下滚动时,我的图形才会显示出来.但对于我的生活,我无法让它工作,它应该是如此简单,doge风格.这样的惊喜!
有问题的图形是一个心脏,animate.css有一个很棒的'脉冲'CSS我想要使用.WOW.js应该与animate.css非常相似.但我完全迷失了.我的JS技能仍然非常基础,所以请耐心等待.
正如WOW.js文档所述,我已将其链接到:
<link rel="stylesheet" href="css/animate.css">
(我的CSS文件夹名为public,但我看不出有什么不同......？)
这位于索引页面的底部:
<script src="js/wow.min.js"></script>
<script>
new WOW().init();
</script>
我将CSS类添加到HTML元素中,如下所示:
<div class="wow"> Content to Reveal Here </div >
然后你应该将animate.css样式添加到元素:
<div class="wow pulse"> Content to Reveal Here </div >
但是我错过了一些东西,因为什么都没有用.我用谷歌搜索了这个,我不是唯一一个与WOW.js有问题的人,但我已经尝试了所有的东西,现在我转向你.
在文档的自定义设置下,它会建议高级设置:
wow = new WOW(
{
boxClass: 'wow', // default
animateClass: 'animated', // default
offset: 0 // default
}
)
wow.init();
我在想,因为这根本不是太棒了,我必须有另一种方式来做这件事,但仍然可以使用CSS动画.
最后一个问题:如何让脉冲动画继续？它会脉冲几次,然后停止,但我希望它能一遍又一遍地继续.建议？