Beautifully crafted timelines that are easy and intuitive to use. http://timeline.knightlab.com/
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
48 lines
3.0 KiB
48 lines
3.0 KiB
12 years ago
|
<!-- Description -->
|
||
|
|
<section id="description" class="container">
|
||
|
|
<h2>How it Works</h2>
|
||
|
|
<div class="row">
|
||
|
|
<div class="span6">
|
||
|
|
<p>TimelineJS is an open-source tool that enables you to build visually-rich interactive timelines from different sources. Creating one is as easy as filling in a Google spreadsheet or as detailed as JSON.</p>
|
||
|
|
<h4>Sources</h4>
|
||
|
|
<p>It can pull in media from different sources and has built in support for: <em>Twitter, Flickr, Google Maps, YouTube, Vimeo, Vine, Dailymotion, Wikipedia, SoundCloud and more media types are added regularly.</em></p>
|
||
|
|
|
||
|
|
<h4>Tips & tricks</h4>
|
||
|
|
<ol>
|
||
|
|
<li>Keep it short, and write each event as a part of a larger narrative.</li>
|
||
|
|
<li>Pick stories that have a strong chronological narrative. It does not work well for stories that need to jump around in the timeline.</li>
|
||
|
|
<li>Include events that build up to major occurrences.<em>Not just the major events.</em></li>
|
||
|
|
</ol>
|
||
|
|
</div>
|
||
|
|
<div class="span6">
|
||
|
|
<div class="well">
|
||
|
|
<h4>Sign up for updates</h4>
|
||
|
|
<p>Get updates, tips and news by email. No Spam.</p>
|
||
|
|
<!-- MailChimp Signup Form-->
|
||
|
|
<div id="mc_embed_signup">
|
||
|
|
<form id="mc-embedded-subscribe-form" action="http://verite.us4.list-manage.com/subscribe/post?u=7cc197123f5f6d3b8dc4e176f&id=d7f2b5d664" method="post" name="mc-embedded-subscribe-form" target="_blank" class="validate form-inline"><span class="mc-field-group">
|
||
|
|
<input id="mce-EMAIL" type="email" value="" name="EMAIL" placeholder="Email" class="input-medium required email"></span><span class="mc-field-group">
|
||
|
|
<input id="mce-NAME" type="text" value="" name="NAME" placeholder="Name" class="input-medium required"></span>
|
||
|
|
<button id="mc-embedded-subscribe" type="submit" value="Subscribe" name="subscribe" class="btn">Subscribe</button>
|
||
|
|
<div id="mce-responses" class="clear">
|
||
|
|
<div id="mce-error-response" style="display: none;" class="response alert alert-error"></div>
|
||
|
|
<div id="mce-success-response" style="display: none;" class="response alert alert-success"></div>
|
||
|
|
</div>
|
||
|
|
<div class="clear"></div>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<h4>Stay connected with us on twitter</h4>
|
||
|
|
<p>
|
||
|
|
<iframe allowtransparency="true" frameborder="0" scrolling="no" src="//platform.twitter.com/widgets/follow_button.html?screen_name=TimelineJS&show_count=true" style="width:220px; height:20px;"></iframe>
|
||
|
|
</p>
|
||
|
|
<p>
|
||
|
|
<iframe allowtransparency="true" frameborder="0" scrolling="no" src="//platform.twitter.com/widgets/follow_button.html?screen_name=zlwise&show_count=true" style="width:220px; height:20px;"></iframe>
|
||
|
|
</p>
|
||
|
|
<p>
|
||
|
|
<iframe allowtransparency="true" frameborder="0" scrolling="no" src="//platform.twitter.com/widgets/follow_button.html?screen_name=knightlab&show_count=true" style="width:220px; height:20px;"></iframe>
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|