arr*_*rey -1 html javascript css animation scroll
如果您访问以下站点：http : //www.justinaguilar.com/animations/scrolling.html
您会注意到动画发生在 Scroll 上，而对我而言，当我下载它时却没有。我该怎么做才能让我的动画出现在滚动上？
小智 5
直接从您链接到的网站复制：
如果您想使用该站点的预制动画，您首先需要将该代码添加到您的项目中。您可以从链接到的网站下载它，也可以直接指向它。
第一个将完成添加
<link rel="stylesheet" href="css/animations.css">
到您的 HTML 文档的 ，并更改您在网站上实际存储它的位置的 href 属性。
第二个将不使用本地路径，您将使用代码指向原始网站，因此您的 href 属性将如下所示：
<link rel="stylesheet" href="http://www.justinaguilar.com/animations/css/animations.css">
然后你需要将 jQuery 添加到<head>你的网页元素中：
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
在</body>标签之前添加这个以在用户滚动到元素时触发动画：
<script>
$(window).scroll(function() {
$('#animatedElement').each(function(){
var imagePos = $(this).offset().top;
var topOfWindow = $(window).scrollTop();
if (imagePos < topOfWindow+400) {
$(this).addClass("slideUp");
}
});
});
</script>
将 #animatedElement 替换为您想要动画的元素的 ID 或类。用动画类替换 slideUp。
400 代表元素和屏幕顶部之间的空间。当元素距离屏幕顶部 400px 时动画激活。增加此数字可使动画更快激活。
| 归档时间： |
|
| 查看次数： |
6946 次 |
| 最近记录： |