很多人想给你自己的网站加一个时间轴，米课和料网的时间轴都很好看，但是时间轴在其他主题里可以轻易实现，但是Avada的时间轴一个是丑，另一个是Blog的时间轴不方便调用；
网上的时间轴代码都是html+css+javascript，这样就切死了不少同袍们，望而却步，晕头转向……
但是！今日，我K某贡献出动态时间轴代码，希望能造福给各位不知道如何添加时间轴的Avada基友们。
废话说的太多，代码分两部分**放在底部压缩包内**，其中有两个文件，**main.css和main.html**
{{{
main.css的内容全部拷贝放于**Avada->Theme Options->Custom Css**
}}}
{{{
main.html的内容全部拷贝放于页面新建一个**code shortcode**内
}}}
好了此时你的界面可能是这样的：
[attach]11249[/attach]
不要怕，在适当的代码编辑器里如notepad++将如下代码中的文本和时间替换成需要的内容
{{{
<div class="cd-timeline-block">
<div class="cd-timeline-img cd-picture">
<i class="fa fa-home fa-2x font_icon"></i>
</div> <!-- cd-timeline-img -->
<div class="cd-timeline-content fusion-animated" data-animationtype="fadeInRight">
<h2>文本</h2>
<span class="cd-date">时间</span>
</div> <!-- cd-timeline-content -->
</div> <!-- cd-timeline-block -->
}}}
如上代码是一段时间轴，main.html中/共放了6段时间轴，可以根据实际情况增删。
大家注意加载动画效果是这两个功劳：{{{
class="fusion-animated"，data-animationtype="fadeInRight"
}}}
[attach]11250[/attach]
class不用管了，只用管data-animationtype就行，如下组合出data-animationtype
Avada有自带的动画有7个效果，分别是***Bounce, Fade,Slide,Zoom,Flash,RubberBand,Shake***，而动画的方向有5种，分别是***Down,Up,Right,Left,Static***，也就是说动画效果有35种，任君选择，例如**fadeInRight**就是fade从右边进入，而**bounceInLeft**，就是从左边跳入。
好了，技术贴写完了，这个东西算是走火入魔的东西，请大家切记不要着魔了，我着魔了，对不起……
添加表情
