Clever Geek Handbook

Fadeout and removechild at boot

I am new to scripting and I am trying to implement a loading fade screen in a new site.

When I customize the parent div of the loading screen (load_screen) and add fadeout and removeChild, the fadeout looks like I would like, but then reappears instead of being removed. How can I change this code?

 <script>
window.addEventListener("load", function(){
      var load_screen = document.getElementById("load_screen");
      document.body.fadeOut(load_screen);
      document.body.removeChild(load_screen);
});
</script>
+3


source to share


1 answer


Using jQuery:

$(document).ready(function() {
    $('#load_screen').fadeOut(7000);

    setTimeout(function() {
        $('#load_screen').addClass('hide'); 
    }, 7000);
});

CSS



.hide {
    display: none;
}

https://jsfiddle.net/d2mxx52y/10/

+2


source






More articles:


All Articles