Simple impress.js does not work

1.8k Views Asked by At

Somehow even the simplest ground up impress.js slide does not work for me :( http://dl.dropbox.com/u/655237/events/GTG.zip … , Always have to use your example.

<html lang="en">
    <head>
        <title>Impress Demo</title>
    </head>
    <body>
        <div id="impress">
            <div id="start">
                    <p style='width:1000px;font-size:80px;
                text-align:center'>Creating Stunning Visualizations</p>
                <p>Impress.js </p>
                </div>

            <div 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">impress().init();</script>
        <script type="text/javascript" src="js/impress.js"></script>
    </body>
</html>

And I have the impress.js file under the js directory.Still none of the latest browser show the slides . I am using firefox 16. enter image description here

1

There are 1 best solutions below

1
On BEST ANSWER

You're calling impress before loading the library, try switching the order of your script tags:

<script type="text/javascript" src="js/impress.js"></script>
<script type="text/javascript">impress().init();</script>

Alternatively use a ready handler function to initialise your page scripts, like window.onload or jquery's ready(). For more on this see this question.

Also, going by the impress examples, in the simplest case each step of the presentation should be an element inside the #impress element with a class name of step.