my animation is not working after I build it on phonegap and install its apk on bluestack

Question

my flip animation is not working after I build it on phonegap and install its .apk on bluestack, can anyone tell me what's the problem?

index.html:

<!doctype html>
<head>
<title>The page flip effect in HTML5</title>
<script type="text/javascript" src="js/turn.min.js"></script>
<script type="text/javascript" src="js/cordova.js"></script>
</head>
<body>

<center>
<div id="flipbook">
    <div style="background:#ff0000;" class="hard"> Turn.js </div>
    <div  style="background:#0000FF;" class="hard"></div>
    <div  style="background:#ff0000;"> Page 1 </div>
    <div style="background:#0000FF;"> Page 2 </div>
    <div style="background:#ff0000;"> Page 3 </div>
    <div style="background:#0000FF;"> Page 4 </div>
    <div style="background:#ff0000;" class="hard"></div>
    <div style="background:#0000FF;" class="hard"></div>
</div>
<script type="text/javascript">
    $("#flipbook").turn({
        width: 600,
        height: '100%',
        autoCenter: true
    });

</script>
</body>
</html>

score 0 · Answer 1 · answered Oct 02 '14 at 17:08

You might need to register the $("#flipbook") event after the document ready event. ie)

$(function(){
    $("#flipbook").turn({
        width: 600,
        height: '100%',
        autoCenter: true
    });
});

It's worth a shot as I'm realizing the compiled .apk files do not work the same as what happens in the browser. For example, I do jQuery animations and then the javascript code I call after an animation does not execute (only happens after I build the app).

So if my above suggestion does not work, I'd try adding your code inside of the "deviceready" event( only fires when using phonegap's compiled code). http://docs.phonegap.com/en/1.0.0/phonegap_events_events.md.html

my animation is not working after I build it on phonegap and install its apk on bluestack

1 Answers1