喜欢的JS交互效果（非原创）

Fullmoonye

于 2021-05-30 21:23:51 发布

阅读量155

点赞数

文章标签： html

本文链接：https://blog.csdn.net/Gliese581za/article/details/117405956

版权

本文探讨了网页中常见的JavaScript交互效果，特别是在页面滚动时元素的微妙动画，这些小动画能够有效吸引用户注意力。

摘要由CSDN通过智能技术生成

有的页面在向下滚动的时候，有些元素会产生细小的动画效果。虽然动画比较小，但却能吸引你的注意。

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<title>WOW.js演示_dowebok</title>
<link rel="stylesheet" href="css/animate.css">
<style>
* { margin: 0; padding: 0;}
body { overflow-x: hidden; font-family: "Microsoft Yahei";}
body h1 { width: 100%; margin: 80px 0; font-size: 50px; font-weight: 500; text-align: center;}
body .txt { margin: 80px 0; font-size: 16px; text-align: center;}
.dowebok { margin: 0 auto;}
.dowebok ul { list-style-type: none;}
.dowebok .row { font-size: 0; text-align: center;}
.dowebok .wow { display: inline-block; width: 280px; height: 280px; margin: 30px 15px 0; border-radius: 50%; font: 30px/280px "Microsoft Yahei"; vertical-align: top; *display: inline; zoom: 1;}
.bg-green { background: #5bd5a0;}
.bg-blue { background: #1daee9;}