Load page only when image loaded

Question

Load page only when image loaded

Navigation

#1 by (2 votes)
#2 by (0 votes)
#3 by (0 votes)

3

Load page only when image is uploaded, how do I do this using JQuery ?

I've tried a few things but have not been successful so far, somebody help me ...

I do not have the id of the image just the one of the div that it is inside ...

EDIT: I'm using a jquery plugin for background image, the backstrech and background image has 2mb and it takes a long time to load, the code I use is this:

<script src="jquery.backstretch.min.js"></script>
<script>
    $.backstretch("fundo.gif");
</script>

the backstretch uses the div with class backstretch

I tried several ways to do this type:

<script>
$(".backstretch").load(function() {
    $("#corpo").show();
});
</script>

and this:

<script>
$("img.backstretch").load(function() {
    $("#corpo").show();
});
</script>

jquery

asked by anonymous 07.04.2014 / 02:00

3 answers

PHPUnit and Selenium - How to call specific functions of the test script? How to use the Quartz Scheduler with the Demoiselle?

score 2 · Answer 1

Use the LOAD event of the image in question

$('#IDdaImagem').on('load',function(){ 
    //'Código para carregar a página/conteúdo' 
})

Img within a DIV

$('#IDdaDIV img').on('load',function(){ 
    //'Código para carregar a página/conteúdo' 
})

score 0 · Answer 2

I advise you to use it this way:

<script src="http//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script><scripttype="text/javascript">
    $(window).load(function(){
        $('body').css('display','block');
    });
</script>

Display none in body, when the page is 100% loaded the script makes it appear, you can use those loading gifs etc.

score 0 · Answer 3

Try this:

    var img = document.getElementsByTagName('img')[0];        
    if (!img.complete) {
           img.src = "../imagens/sem_imagem.jpg" ;
     }

EDIT: obviously I have not used jquery, because it's much easier