-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html.1
37 lines (37 loc) · 1.6 KB
/
index.html.1
1
<html> <head> <title>Impress Demo</title> <meta http-equiv="Content-Type" content="text/html; charset=us-ascii" /> <link href="https://s3.amazonaws.com/static.opml.org/opmlEditor/impress/css/impress-demo.css" rel="stylesheet" type="text/css" /> <style> .style1 { </style> </head><body> <div id="impress"> <div class="step" data-x="0" data-y="0" class="style1"> Welcome. </div> <div class="step" data-x="500" data-y="0"> I have a story I'd like to tell. </div> <div class="step" data-x="500" data-y="-400"> It's about a very cool JavaScript library called <a href="http://www.linuxforu.com/2012/05/impress-dot-js-audience-with-your-presentation/">Impress</a>. </div> <div class="step" data-x="500" data-y="-800" data-scale="0.5"> It does these transitions and 3D effects. They get fancier as the demo progresses.<br><br>And the text gets longer too. :-) </div> <div class="step" data-x="0" data-y="-800" data-rotate="90"> I wrote these slides in the <a href="http://home.opml.org/">OPML Editor</a>. Of course. :-) </div> <div class="step" data-x="-100" data-y="-800" data-rotate-x="60" data-rotate-y="60" data-rotate-z="30"> It's an outliner. </div> <div class="step" data-x="-2600" data-y="-800" data-rotate-x="30" data-rotate-y="-60" data-rotate-z="90" data-scale="4"> And it's all being managed by the <a href="http://userdocs.worldoutline.org/">worldoutline</a> server. </div> </div> <script type="text/javascript" src="https://s3.amazonaws.com/static.opml.org/opmlEditor/impress/js/impress.js"></script> <script>impress().init();</script> </body></html>