DZone Snippets is a public source code repository. Easily build up your personal collection of code snippets, categorize them with tags / keywords, and share them with the world

Neil Ghosh Graduated from University College of Engineering, Burla and have over 6 years of experience in ERP, Web services and Web application development.He has contributed to various Financial Software and Mobile projects with his expertise in Oracle, Java, J2EE, jQuery, PHP and MySQL. Neil presently works for Electronic Arts and earlier worked as a project leader in Oracle Corporation in Oracle Applications ERP Development team. He is also chair of IEEE GOLD affinity group of Hyderabad section. He is also a co-organizer of Java User groups Hyderabad. Apart from programming his interest involves Astronomy and Cricket and other outdoor activities. Neil has posted 2 posts at DZone. You can read more from them at their website. View Full User Profile

Creating simple HTML5 slide presentation with impress.js

06.27.2013
| 4623 views |
  • submit to reddit
<html lang="en">
    <head>
        <title>Impress Demo</title>
    </head>
    <body>
        <div id="impress">
            <div class="step slide" id="start">
                    <p style='width:1000px;font-size:80px;
                text-align:center'>Creating Stunning Visualizations</p>
                <p>Impress.js </p>
                </div>
 
            <div class="step slide" id="slide2" data-x="-1200" data-y="0">
                    <p style='width:1000px;font-size:80px;'>
                First Slide Moves From Left To Right</p>
                <p>Impress.js </p>
                </div>
        </div>
        <script type="text/javascript" src="js/impress.js"></script>
        <script type="text/javascript">impress().init();</script>
    </body>
</html>

With the recent growth of HTML5 adaption, I have seen many people using HTML slides instead of traditional Power Point/Open Office presentation.

You can download the impress.js and save in the “js” directory.