<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" type="text/css" href="../WOW-master/css/libs/animate.css">
<style type="text/css">
.q {
width: 500px;
height: 200px;
margin: 0 auto;
border: 1px solid #000000;
margin-bottom: 200px;
background: #000000;
}
</style>
</head>
<body>
<div class="q wow bounce">asifjh</div>
<div class="q wow bounceIn">asifjh</div>
<div class="q wow bounceInUp">asifjh</div>
<div class="q wow bounceInDown">asifjh</div>
<div class="q wow bounceInLeft">asifjh</div>
<div class="q wow slideInLeft">asifjh</div>
<div class="q wow slideInRight">asifjh</div>
<div class="q wow bounceInRight">asifjh</div>
<div class="q wow slideInUp">asifjh</div>
<div class="q wow slideInDown">asifjh</div>
<div class="q wow lightSpeedIn">asifjh</div>
<div class="q wow pulse">asifjh</div>
<div class="q wow flipInX">asifjh</div>
<div class="q wow flipInY">asifjh</div>
<div class="q wow bounce">asifjh</div>
<div class="q wow shake">asifjh</div>
<div class="q wow swing">asifjh</div>
<div class="q wow bounceInU">asifjh</div>
<div class="q wow wobble">asifjh</div>
</body>
<script type="text/javascript" src="../WOW-master/dist/wow.min.js"></script>
<script type="text/javascript">
new WOW().init();
var wow = new WOW({
boxClass: 'wow',
animateClass: 'animated',
offset: 0,
mobile: true,
live: true
});
</script>
</html>
使用wow.js和animate.css滑动页面加载盒子特效
最新推荐文章于 2022-06-05 14:14:13 发布