jEgpjp

index.html

<div id="timeline-container">
  <div id="my-timeline"></div>
</div>

<!-- always load the CSS -->
<link rel="stylesheet" type="text/css" href="http://cdn.knightlab.com/libs/timeline/latest/css/themes/dark.css">
<!-- but no need for both -->

jEgpjp.markdown

jEgpjp

A Pen by hellonicolas on CodePen.

License.

script.js

$(document).ready(function() {
                createStoryJS({
                    type:       'timeline',
                    width:      '100%',
                    height:     '100%',
                    source:     'https://docs.google.com/spreadsheet/pub?key=0Agj2HRrBDEjJdGtiUTg3aFFUY3hfU1YtbmFuejZjWGc&output=html',
                    embed_id:   'my-timeline'
                });
            });

scripts

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="http://cdn.knightlab.com/libs/timeline/latest/js/storyjs-embed.js"></script>

style.css

#my-timeline {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}