0

I have tryed all the suggestions but none seem to work with this plugin. I am not using a ajax call, the delay is due to some data map rendering issue.

I followed this method: http://bradsknutson.com/blog/display-loading-image-while-page-loads/

Altough I add the div tag at the very begining of my html, when I debug the code I saw it after many div tags that belongs for the plugin. Summed it up, it isn't at the top of the html.

The .js and the .css are the same in the example.

So I have

html

<div class="loader"></div>

css

.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('images/page-loader.gif') 50% 50% no-repeat rgb(249,249,249);
}

js

$(window).load(function() {
    $(".loader").fadeOut("slow");
})

Side note: I tryed to replace fadeOut for hide().

This method isn't working, thanks

rossig7
  • 81
  • 1
  • 10
  • I am closer, but it doesn't work yet. I followed this example, but the gif never gets hidden. It's always visible. http://stackoverflow.com/questions/1853662/how-to-show-page-loading-div-until-the-page-has-finished-loading – rossig7 Apr 23 '16 at 23:19

1 Answers1

1

It looks like you need to use:

("#loading").fadeOut("slow");

enter image description here

Andy Hoffman
  • 18,436
  • 4
  • 42
  • 61
  • Thanks, I'll take a look. if you want check this bicimapuy2.herokuapp.com, there's the code – rossig7 Apr 24 '16 at 01:53
  • Indeed I don't see any differences from what I did. The main one is that I have a lot of code and not only the one of the example. I render a map, a menu, etc – rossig7 Apr 24 '16 at 01:55
  • Thanks, I put hide() in a previous version with the same result. I not with my laptop right now. I will check it tomorrow and then I will be able to say something new..(I hope). – rossig7 Apr 24 '16 at 02:57
  • Actually now it's working with the last example, either with hide() or fadeOut. Thanks a lot for your help. – rossig7 Apr 25 '16 at 23:32