Publicado em 20 de set.

Só mostrar a imagem depois de carregar

Essa semana, comecei mexer um pouco no jquery, e, embora existam "mil soluções" que carreguem uma imagem, resolvi fazer algo simples para entender melhor o funcionamento.

Cheguei no seguinte código:

 $("a[rel=galeria]").click ( function() { // Click
 var img = $(this).attr("href");

 $.ajax({ // Ajax
 url: "galeria.php",
 type: "POST",
 data: ({url: img }),
 success:function(html){
 //alert(html);
 $('#imagem')
 .removeClass('carregando')
 .append(html);
 $("#imagem img").fadeIn();
 },
 /*complete: function() {
 //$('#imagem').removeClass('carregando');
 },*/
 beforeSend: function() {
 $('#imagem').addClass('carregando');
 $("#imagem img").remove();
 }
 }); // Fim Ajax
 return false;
 }); // Fim Click

galeria.php

<?php
echo("<img src={$_POST['url']}>");
?>

O problema desse código é que, ele vai mostrando a imagem aos poucos, e não, totalmente, como no lightbox, por exemplo.

Onde estou errando?

Abs

Discussão (2)

Entre ou cadastre-se para participar da discussão

Entrar Criar conta

William Bruno· 20 de set.

Amigo, é desnecessário usar requisição AJAX nesse processo.

você apenas está devolvendo oque já tinha antes. Percebe que está indo para o servidor sem necessidade?

Seguindo oque você acha que quer, teria que fazer um preload, depois de receber a imagem..(que você já sabe qual é antes de enviar http://forum.imasters.com.br/public/style_emoticons/default/ermm.gif ), mas como não temos como medir se o preload terminou, e pela total falta de lógica desse processo, não sei nem como faríamos isso.

É possível fazer o mesmo que você fez, totalmente no cliente, sem solicitar nada no servidor.

Já que é apenas para trocar o atributo src da imagem.

tocho· 20 de set.

>
Amigo, é desnecessário usar requisição AJAX nesse processo.

você apenas está devolvendo oque já tinha antes. Percebe que está indo para o servidor sem necessidade?

É possível fazer o mesmo que você fez, totalmente no cliente, sem solicitar nada no servidor.

Já que é apenas para trocar o atributo src da imagem.

Hum...acho que estou viajando mesmo. Porém, mudando apenas o atributo SRC da imagem, como eu saberei que ela está completamente carregada, para depois exibir na tela?

abs