0

I am a HTML and JS newbie struggling with why a loader which calls a looping gif does not loop. I have copied bits of code from other threads here to learn how to make a loading page but I have got stuck. The current code below plays the gif file once and the fades to a white screen that remains until the content of the following page is loaded. If I move the scripts around the page, I can have the gif loop working but it never opens the following page. I know I am missing something .. I just can't find what. Any suggestion would be very grateful

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width" />

<!-- Css -->
<link rel="stylesheet" type="text/css" href="css/loader.css" media="screen" />

<!-- Script -->
<script src="js/jquery.min.js"></script>
<script src="js/jquery-ui.min.js"></script>
<script src="js/b4w.min.js"></script>
<script src="js/camera_anim.js"></script>

<script>

var m_app = b4w.require("app");
var m_data = b4w.require("data");
var m_cam = b4w.require("camera_anim");

m_app.init({
    canvas_container_id: "container_id",
        callback: load_cb,
        show_fps: false,
        console_verbose: true,
        autoresize: true
})

function load_cb() {
    m_data.load("151010_CL_BOX04_MERGED_BLEND4WEB_WIREFRAME_APPLY.json", loaded_cb);
}

function loaded_cb() {
    m_app.enable_controls();
    m_app.enable_camera_controls();
    m_cam.auto_rotate(0.15);
}

</script>

</head>

<body>
<div id="loader"></div>
   <script>

 
 $(window).load(function(){
 <!--    $("#loader").effect("bounce", { times:4, distance:200 }, 400); -->
    $("#loader").fadeOut("slow");
});
 
 </script>
   

<div id="container_id" style="position: absolute; left: 0px; top: 0px; width:100%; height: 100%;"></div>

</body>

</html>
  • http://stackoverflow.com/questions/10730212/proper-way-to-reset-a-gif-animation-with-displaynone-on-chrome http://www.denisbouquet.com/replay-animated-gif-javascript/ – Nick R Oct 28 '15 at 10:48
  • Thank you for the link. My problem is not with reloading the loop. The loop works fine. The problem is how to tell the script that the page is fully loaded and therefore move on to the loaded page. – Christopher Lowden Oct 28 '15 at 22:06

0 Answers0