在线演示
Timeline 是我见过的最酷的展示事件随时间发展的javascript实现。你可以基于时间使用讲故事的方式来创建时间轴特效，整个时间轴以幻灯的方式来展示，你可以穿插图片，视频或者是网站，而且拥有非常华丽的动画效果和缩略图效果，非常适合做网站的关于我们功能。
主要特性
- 支持外部社交网站，例如，twitter.com， youtube，flickr，vidmeo，Google Maps
- 开源免费
- 文档齐全
- 使用简单
- 支持数据格式：JSON，Google Doc，HTML
如何使用
插入javascript类库
<!-- CSS -->
nk href="timeline.css" rel="stylesheet">
<!-- JavaScript -->
<script type="text/javascript" src="jquery-min.js"></script>
<script type="text/javascript" src="timeline-min.js"></script>
添加生成timeline的div
<div id="timeline"></div>
初始化timeline
<script>
$(document).ready(function() {
var timeline = new VMM.Timeline();
timeline.init("your_data.json");
});
</script>
搞定！
基本代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<title>Timeline - Kitchen Sink</title>
<!-- CSS -->
<link href="http://veritetimeline.appspot.com/latest/timeline.css" rel="stylesheet">
<!-- JavaScript -->
<script type="text/javascript" src="http://veritetimeline.appspot.com/latest/jquery-min.js"></script>
<script type="text/javascript" src="http://veritetimeline.appspot.com/latest/timeline-min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var timeline = new VMM.Timeline();
timeline.init("http://veritetimeline.appspot.com/latest/examples/kitchen-sink.json");
});
</script>
</head>
<body>
<div id="timeline"></div>
</body>
</html>
分享到：
相关推荐
时间轴（Timeline）是WPF动画系统的核心组成部分，用于定义和控制动画的时间行为。 首先，让我们理解`Timeline`类的基本概念。`Timeline`是所有动画和时间线的基础类，它定义了动画的时间属性，如开始时间、持续...
使用jQuery作为基础，意味着该时间轴插件将具有良好的浏览器兼容性和高效的性能。 在压缩包文件中，"timeline"可能是包含插件源代码、CSS样式文件以及示例HTML文件的文件夹。源代码可能分为JavaScript部分，负责...
《jQuery刻度尺风格横向时间轴插件timeline详解》 在网页设计中，时间轴是一种常见且有效的展示信息的方式，它能清晰地呈现事件的顺序和时间跨度。jQuery作为一款强大的JavaScript库，提供了丰富的功能来简化网页...
在Android开发中，时间轴（Timeline）是一种常用于展示序列事件或者步骤的视觉元素，它可以帮助用户更好地理解和跟踪一系列操作或活动。本示例将详细解释如何在Android应用中实现一个自定义的时间轴效果。 首先，...
在给定的“安卓时间轴时光轴相关-时间轴TimeLine.rar”压缩包中，可能包含了实现时间轴功能的源码、资源文件以及相关的帮助文档。以下是对这些内容的详细解释： 1. **AndroidManifest.xml**：这是每个安卓应用的...
【标题】"Android高级应用源码-时间轴 TimeLine.zip" 涉及的主要知识点是Android平台上的时间轴（TimeLine）设计与实现。在移动应用开发中，时间轴是一种常见的展示信息的方式，通常用于展示事件序列或者动态更新的...
**jQuery刻度尺风格...通过以上分析，我们可以看出"jQuery刻度尺风格横向时间轴插件timeline"是一个强大且灵活的工具，它不仅提供了丰富的功能，还有良好的可定制性和适应性，是Web开发者构建时间轴应用的理想选择。
**jQuery可伸缩时间轴代码timeline插件**是一款强大的前端开发工具，专为构建美观、交互性强的时间轴展示而设计。这款插件基于流行的JavaScript库jQuery构建，它提供了丰富的功能和自定义选项，使得开发者可以轻松...
总之，jQuery横向时间轴插件timeline是利用jQuery的强大功能和灵活性，为网页提供了一种直观展示时间序列事件的方式。通过理解和掌握上述知识点，开发者能够更好地运用和定制这款插件，以适应各种各样的项目需求。
Unity 时间轴Timeline动画动态扩展
时间轴（Timeline）是一种在图形用户界面中呈现事件序列或时间序列数据的可视化工具。它通常用于展示历史事件、项目进度、系统状态变化等，帮助用户理解数据的时间分布和顺序。在IT领域，时间轴控件是数据分析和可视...
Android时间轴(Timeline)效果的实现(使用RecyclerView)代码示例，详细内容请参考：http://blog.csdn.net/u012939909/article/details/53510203
为了使时间轴看起来更加动态，你可以使用`.timeline-left`、`.timeline-right`、`.timeline-center`等类来调整时间点的位置。 例如，一个基本的时间轴结构可能如下： ```html <div class="timeline"> ...
在IT行业中，时间轴（TimeLine）是一种常见且重要的数据可视化工具，用于展示事件或数据按照时间顺序排列的情况。在给定的“时间轴timeLine”主题中，我们可以深入探讨这个概念及其应用，特别是在交互式界面设计中的...
在移动端应用开发中，时间轴（Timeline）是一种常见的可视化组件，用于展示按时间顺序排列的事件或数据。本文将深入探讨如何使用JavaScript实现一个适用于移动端的时间轴插件，并结合提供的压缩包资源，帮助开发者...
《jQuery时间轴（Timeline）详解及应用》 在网页设计中，时间轴（Timeline）是一种常见且有效的展示信息的方式，它能将事件按照时间顺序排列，帮助用户清晰地理解历史进程或者项目进度。jQuery时间轴插件是实现这一...
《jQuery可伸缩时间轴插件timeline深度解析》 在Web开发中，视觉效果与交互体验是提升用户体验的关键因素之一。jQuery作为一款广泛使用的JavaScript库，提供了丰富的功能和简便的API，使得开发者能够轻松实现各种...
Bootstrap提供了一系列CSS类，如`.timeline`, `.timeline-item`, `.timeline-badge`, `.timeline-content`等，用于定制时间轴的样式和结构。 在实现Bootstrap时间轴时，开发者需要考虑以下几点： 1. **响应式设计*...