一款简单的jQuery水平时间轴样式代码,带左右按钮控制向左向右滑动,可以用来展示个人历程、公司大事记等。
js代码
<script type="text/javascript">
$(function() {
var timeLength = $('.time-box li').length,
timeliWidth = $('.time-box li').outerWidth();
var index = 0;
$('.time-box ul').width(timeLength * timeliWidth);
function slideOne(i) {
var scrollVal = i * timeliWidth; //每次切换的数量
$('.time-box').stop().animate({
scrollLeft: scrollVal
}, 300);
}
$('.right-btn').click(function() {
index = index >= (timeLength-4) ? 0 : index + 1;
slideOne(index);
})
$('.left-btn').click(function() {
index = index <= 0 ? (timeLength-4) : index - 1;
slideOne(index);
})
})
</script>
系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791