Loading effect con un gif en jquery

naitmeir · #1 (**permalink**) 02/04/2011, 03:26

Buenas,

Necesito hacer un "loading" con un gif, mientras termino de cargar una pagina de en un div de id="test" de este modo:

Código Javascript:

Ver originalfunction mifunc(){
 
    $(document).ready(function() {
        $('#test').load(
        './pagina.php?');
    });     
}

El gif obviamente ha de desaparecer cuando se termine de cargar la pagina. Hay que acomodar tambien la pagina en php para hacer este efecto?

Código Javascript:

Ver original$(document).ready(function() {
        $('#test').load(
        './pagina.php?', function(){
            
            alert('Load was performed.');
            
        });
    });

Habia visto esta otra forma de hacerlo pero era con un alert ...

S2

naitmeir · #2 (**permalink**) 02/04/2011, 11:39

Ya encontre el modo:

Código HTML:

Ver original<html>
    <head>
        <title>Ejemplo</title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script><script>
        $(function(){            
            $('#button').click(function(){
                alert("test");
                $('#prueba').html('<img src="preloader.gif" alt="cargando"/> Cargando... ').load('test.php');      
                return false;
            });
        });
        </script>
    </head>
    <body>
        <a href="#" id="button">test</a>
        <div id="prueba" style="width:300px;height:300px;background:#ccc"></div>
    </body>
</html>