Add: 页面动画效果 fade-in-down
This commit is contained in:
parent
30a881eb4f
commit
d9ee2d6d41
|
@ -1,6 +1,6 @@
|
||||||
<!-- 通用页面模板 -->
|
<!-- 通用页面模板 -->
|
||||||
<div class="page-container">
|
<div class="page-container">
|
||||||
<div class="page-left">
|
<div class="page-left animated">
|
||||||
<%- partial('left-side') %>
|
<%- partial('left-side') %>
|
||||||
</div>
|
</div>
|
||||||
<div class="page-right">
|
<div class="page-right">
|
||||||
|
|
|
@ -1,8 +1,8 @@
|
||||||
<div class="right-side-container">
|
<div class="right-side-container">
|
||||||
<div class="nav-container">
|
<div class="nav-container animated">
|
||||||
<%- partial('common/nav') %>
|
<%- partial('common/nav') %>
|
||||||
</div>
|
</div>
|
||||||
<div class="article-post-container">
|
<div class="article-post-container animated">
|
||||||
<% if (is_home()) { %>
|
<% if (is_home()) { %>
|
||||||
<!-- 载入首页的内容 -->
|
<!-- 载入首页的内容 -->
|
||||||
<%- partial('common/home-post') %>
|
<%- partial('common/home-post') %>
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
.animated {
|
.animated {
|
||||||
animation-fill-mode: both;
|
animation-fill-mode: both;
|
||||||
animation-duration: 1s;
|
animation-duration: 1s;
|
||||||
|
animation-name fade-in-down
|
||||||
}
|
}
|
||||||
|
|
||||||
.animated.hinge {
|
.animated.hinge {
|
||||||
|
@ -18,7 +19,3 @@
|
||||||
transform: translateY(0);
|
transform: translateY(0);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.fade-in-down {
|
|
||||||
animation-name: fade-in-down;
|
|
||||||
}
|
|
||||||
|
|
Loading…
Reference in New Issue