所以我是一个非常基本的程序员。我大二的时候我在HS上了一门Web设计课程，而现在我只是一个初中生，试图为大学和其他东西创建一个个人网站。
其中之一是使用动画。我想使图片翻转或滚动滚动，并且在网上寻找时发现了AOS库。
http://michalsnik.github.io/aos/
我尝试学习，但是GitHub确实使Bower和Npn或其他东西使我感到困惑。我希望能够在我的网站上使用AOS库命令，但是我几乎不了解javascript，因为我真正了解的只是HTML和CSS。尽管我使用Windows，但我还是尽量遵循该视频，因为它通常是相同的想法：
https://www.youtube.com/watch?v=5XriUcr-QT0
（跳到0:34）我从github下载了AOS zip，当我尝试获取他称之为CSS和JS工作表或插件的东西时，我什至找不到该文件夹。我尝试按照AOS库网站在底部说的那样链接工作表，头部带有CSS链接，主体带有javascript链接，但是当我尝试启动AOS的使用时，该命令看起来像这样：
普通文本中的data-aos部分与调用id或class时不同。 dist文件夹作为视频状态在哪里？如何正确链接和使用AOS库中提供的这些命令？另外，我是否需要使用和了解我的小型个人网站所使用的纱线和Bower？
最佳答案
其实这很简单，您可以在这里使用我的示例...
https://jsfiddle.net/54cvqLy8/2/
这是代码
<html>
<head>
<link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
</head>
<body style="float:left;width:50%">
<div class ="big-div" data-aos="fade-in">Hello!</div>
<div class ="big-div" data-aos="fade-right">Goodbye!</div>
<script src="https://unpkg.com/aos@next/dist/aos.js"></script>
<script>
AOS.init({
easing: 'ease-out-back',
duration: 2000 // this is the time the transistion takes to complete
});
</script>
</body>
</html>
和要添加的样式
.big-div {
float:left;
background-color:red;
width:100%;
heigth:330px;
padding-top:200px;
padding-bottom:100px;
text-align:center;
color:yellow;
font-size:28px;
margin-bottom:300px;
}
您只需要在页面头部和正文中包含文件即可。
对于CSS使用https://unpkg.com/aos@next/dist/aos.css，对于js使用https://unpkg.com/aos@next/dist/aos.js
如果要使用本地副本而不是远程副本，只需将URL粘贴在浏览器中，然后将内容保存在本地Web服务器文件夹中名为aos.css和aos.js的文件中。
之后，只需将它们包括在您的页面上即可（标题和末尾的js中都有css，瞧，您就可以开始使用。添加具有所需过渡效果的元素并享受其中！