Consulta - jquery LOAD

[rossijona]

Buenas estimados, realizo la siguiente consulta porque hace días estoy probando y no me esta resultando...

Les cuento, estoy usando la función LOAD de JQUERY, pero me gustaria realizar un "loading" con gif pero que este gif sea display: none cuando la ejecucion del load haya finalizado...

Una cosa, la ejecucion del Load no es por ajax, algo como el siguiente ejemplo:

Código:

$('.selector').load('<img src="blablabla.jpg" title="supongamos que la imagen pesa 2gb..." />', function(){ $('.loading').css('display','none'); alert ('Al fin finalizo la carga de la imagen de 2GB :O') });

No se si me explico, pero mi idea es que se ejecute el display: none del loading y el alert luego de que finalice la carga de la imagen de 2GB.

Muchas gracias!!!.

[emprear]

@rossijona

En primer lugar el primer parámetro de load debe ser una url, en segundo... realmente intentás cargar una imagen de 2GB? Con una conexión como la mia (5MB) tardaría mas o menos una hora. Y para finalizar load(); en jquery ES Ajax
Asi que fijate y explicá mejor que es lo que intentás

Saludos

[rossijona]

Buenas, en primer lugar, lo de la imagen de 2GB seria una locura subir, fue solo un ejemplo de contenido pesado.

Bueno, mira, digamos que lo que necesito es realizar aparecer un gif loading mientras carga una imagen por detrás y cuando esta finalice de cargar, el loading desaparece.

Básicamente me pregunto si en jquery hay manera de hacerlo sin necesidad de usar ajax y sin usar setTimeout porque eso no sería lo que busco.

Perfectamente puedo usar un ajax y hacer desaparecer el gif loading al final del archivo php, pero no quiero llegar a usar un archivo externo para esto.

Gracias!

[emprear]

Un fake loader digamos,
algo asi

Código HTML:

<div style="background-image: url(ajax-loader.gif); background-position: center center; background-repeat: no-repeat;padding: 0; height: 500px; width: 500px;">
<img src="steel6.jpg" alt="" widt="500" height="500" />
</div>
 

Tambien probar de poner el background-image directamente a la imagen, sin el div
Pero probandolo en local no me llego a dar cuenta si funciona porque la imagen por mas grande que sea (probe con una d 6MB), carga muy rápido.

Si lo que querés es que funcione siempre, hay que hacer un setTimeout y una sustitución de imagen con javascript

Y cuando pongas tus ejemplos, tratá de que sean lo más fidedignos posibles, eso de los 2GB, era por lo menos, desconcertante

SAludos