位置: 编程技术 - 正文
推荐整理分享jQuery Timelinr实现垂直水平时间轴插件(附源码下载),希望有所帮助,仅作参考,欢迎阅读内容。
文章相关热门搜索词:,内容如对您有帮助,希望把文章链接给更多的朋友!
jquery.timelinr.js是一款效果非常炫酷的jQuery时间轴插件。jquery.timelinr可以制作水平和垂直时间轴效果,并且可以进行自动播放。你可以通过参数来控制每次时间轴切换的动画效果。
推荐阅读:之前分享过一款 jQuery实现企业发展简史时间轴特效源码 ,它的界面展示效果很不错。
效果展示 源码下载
使用方法
使用该时间轴插件需要在页面中引入jQuery和jquery.timelinr.js文件。
HTML结构
该时间轴插件的基本HTML结构如下:
初始化插件
在页面DOM元素加载完毕之后,可以通过下面的方法来初始化该时间轴插件。
配置参数
jquery.timelinr.js时间轴插件的配置参数有:
orientation:时间轴的方向,可选值有:horizontal | vertical默认值为'horizontal'。containerDiv:时间轴容器DIV的ID选择器。默认为:'#timeline'。datesDiv:显示时间的容器的ID选择器。默认为:'#dates'。datesSelectedClass:当前选中时间的class。默认值为:'selected'。datesSpeed:时间轴的动画速度。值从-,或'slow','normal','fast'。默认值为:'normal'。issuesDiv:信息描述的DIV的ID选择器。默认为:'#issues'。issuesSelectedClass:当前选择的信息描述的DIV的class。默认值为:'selected'。issuesSpeed:信息描述的DIV的动画速度。值从-,或'slow','normal','fast'。默认值为:'fast'。issuesTransparency:信息描述的DIV的透明度。值0-1之间,默认值为0.2。issuesTransparencySpeed:透明度动画的速度。值从-之间,默认为。prevButton:向前按钮的ID选择器。默认为:'#prev'。nextButton:向后按钮的ID选择器。默认为:'#next'。arrowKeys:是否允许使用键盘来控制。默认为:false。startAt:开始的索引下标,默认为1。autoPlay:是否自动播放。默认为'false'。autoPlayDirection:自动播放的方向。可选值有:forward | backward。默认值为:'forward'。autoPlayPause:自动播放的间隔。整数值, = 1秒,默认为。jquery.timelinr.js时间轴插件的github地址为: Timelinr实现垂直水平时间轴插件的相关内容,希望对大家有所帮助!
使用jQuery判断Div是否在可视区域的方法 判断div是否可见 !DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""
实例讲解jquery中mouseleave和mouseout的区别 本文详细的介绍了关于jQuery中mouseleave和mouseout的区别,分享给大家供大家参考,具体内容如下很多人在使用jQuery实现鼠标悬停效果时,一般都会用到mouse
jQuery simplePage+AJAX plus分页插件用法实例 本文实例讲述了jQuerysimplePage+AJAXplus分页插件。分享给大家供大家参考,具体如下:!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""
标签: jQuery Timelinr实现垂直水平时间轴插件(附源码下载)
本文链接地址:https://www.jiuchutong.com/biancheng/381968.html 转载请保留说明!友情链接: 武汉网站建设