lungo framework does not work with example code

Question

I am testing lungo framework, and by reading their examples (http://lungo.tapquo.com/howto/prototype), it does not work.

I am using their skeleton code:

 <body class="app">

<section id="main" data-transition="">
    <article id="main-article" class="active">
        test.
    </article>
</section>

<script src="components/quojs/quo.js"></script>
<script src="components/lungo/lungo.js"></script>

<script type='text/javascript'>
    Lungo.init({
        name: 'example'
    });
</script>

</body>

I have no errors in my console. What can be causing the issue? Thanks in advance.

what is showing on screen ? I know you have no error, but is there anything on screen ? — Raptor, Apr 05 '13 at 09:54
all that appears is "test." but it's no styled or anything. if i try the other examples, they just appear plainly as if there is no styling/js going on. — john smith, Apr 05 '13 at 09:55
check the external script path. is your path correct ? Look at `Developer Console > Network` to check whether there are missing files. — Raptor, Apr 05 '13 at 09:58
all that is being loaded are those two files. checked the network tab and they are all succesfully transfered. does 'lungo' work on your machine? — john smith, Apr 05 '13 at 10:02
let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/27619/discussion-between-john-smith-and-shivan-raptor) — john smith, Apr 05 '13 at 10:02

score 1 · Answer 1 · answered Apr 17 '13 at 14:13

If that's all of your HTML, then you're missing a whole bunch of CSS files, etc. Could you share a JS fiddle or longer code example? The way you're not getting any JS errors implies to me you may well be missing some CSS. Also, what version of Lungo are you using? How did you obtain it?

Lots of questions :) However, I created a basic Lungo JSfiddle a while ago - http://jsfiddle.net/otupman/vz59n/ - try that and see if it works. In the "External Resources" section you'll find the CSS & JS I'm including to make it work.

The simple code I'm using (as S/O won't let me post a JSFiddle link without code) simply looks like this:

<section id="main" > 
    <header data-title="JsFiddle Lungo">
        <nav class="left">
            <a data-icon="home"></a>
        </nav>
    </header>
    <article class="active" id="first_article">
        <strong>Simple Example</strong>
        <a href="#second_article" data-router="article">Second article</a>
        <br/>
        <a href="#second_section" data-router="section">Second section</a>
    </article>
    <article id="second_article">
        <strong>Second article</strong>
        <a href="#first_article" data-router="article">First article</a>
        <br/>
        <a href="#second_section" data-router="section">Second section</a>
    </article>
</section>

All of the CSS/JS files are coming from Lungo's example, for example, one CSS is http://lungo.tapquo.com/example/components/lungo/lungo.css

lungo framework does not work with example code

1 Answers1