jQuery实现时间轴特效

jQuery实现时间轴特效

jQuery时间轴,可左右点击切换、点击年,切换下面对应的内容;

使用方法
在页面引入相关HTML代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<div class="timer-scale-cont hov">
<p class="time-circle">2018</p>
<p class="line-scale"></p>
</div>
<div class="timer-scale-cont">
<p class="time-circle">2017</p>
<p class="line-scale"></p>
</div>
<div class="timer-scale-cont">
<p class="time-circle">2016</p>
<p class="line-scale"></p>
</div>
<div class="timer-scale-cont">
<p class="time-circle">2015</p>
<p class="line-scale"></p>
</div>
<div class="timer-scale-cont">
<p class="time-circle">2014</p>
<p class="line-scale"></p>
</div>
<div class="timer-scale-cont">
<p class="time-circle">2013</p>
<p class="line-scale"></p>
</div>
<div class="timer-scale-cont">
<p class="time-circle">2012</p>
<p class="line-scale"></p>
</div>
<div class="timer-scale-cont">
<p class="time-circle">2011</p>
<p class="line-scale"></p>
</div>
<div class="timer-scale-cont">
<p class="time-circle">2010</p>
<p class="line-scale"></p>
</div>

JS代码

1
2
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/sjz.js"></script>
当前内容只有登录了才能查看,如果您已经注册,请登录
0

发表评论