如果不能使用wow.js,可以考虑使用其他的动画库或自己编写动画效果。
以下是一个使用CSS和JavaScript实现动画效果的示例:
HTML部分:
Hello, world!
CSS部分:
.animate-element {
opacity: 0;
transition: opacity 1s;
}
.animate-element.animate {
opacity: 1;
}
JavaScript部分:
document.addEventListener("DOMContentLoaded", function() {
var element = document.querySelector(".animate-element");
var delay = 200; // 延迟动画效果出现的时间,单位为毫秒
function animateElement() {
element.classList.add("animate");
}
setTimeout(animateElement, delay);
});
这段代码会在页面加载完成后,通过添加CSS类名来触发动画效果。在上述示例中,使用了CSS的opacity
属性来实现淡入效果,通过添加或删除animate
类名来切换动画效果。
你可以根据自己的需求修改CSS和JavaScript代码,实现不同的动画效果。