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.

42 lines
2.5 KiB

<!-- 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 anyone to build visually,rich, interactive timelines. Beginners can create a timeline using nothing more than a Google spreadsheet. Experts can use their JSON skills to create custom installations, while keeping TimelineJS's core look and functionality.</p>
<h4>Sources</h4>
<p>It can pull in media from a variety of sources and has built-in support for Twitter, Flickr, Google Maps, YouTube, Vimeo, Vine, Dailymotion, Wikipedia, SoundCloud and more.</p>
<h4>Tips &amp; 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://northwestern.us2.list-manage.com/subscribe/post?u=ccc3ef81b4c3c762eb7a7d2b4&amp;id=ff5b6c54e5" 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-large required email"></span><span class="mc-field-group">
<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=knightlab&amp;show_count=true" style="width:220px; height:20px;"></iframe>
</p>
</div>
</div>
</div>
</section>