Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

337
Visualizações
Cómo desvanecerse cambiando la imagen de fondo

Quiero desvanecer las imágenes cuando hago este código:

 $("#large-img").css('background-image', 'url('+$img+')');

He intentado poner desvanecimiento en tantos lugares.

Gracias

over 4 years ago · Santiago Trujillo
3 Respostas
Responde à pergunta

0

Esto es probablemente lo que querías:

 $('#elem').fadeTo('slow', 0.3, function() { $(this).css('background-image', 'url(' + $img + ')'); }).fadeTo('slow', 1);

Con un retraso de 1 segundo:

 $('#elem').fadeTo('slow', 0.3, function() { $(this).css('background-image', 'url(' + $img + ')'); }).delay(1000).fadeTo('slow', 1);
over 4 years ago · Santiago Trujillo Relatório

0

¿Puedo ofrecer una solución alternativa?

Tuve el mismo problema y el desvanecimiento no funcionó porque desvaneció todo el elemento, no solo el fondo. En mi caso el elemento era el cuerpo, así que solo quería desvanecer el fondo.

Una forma elegante de abordar esto es clasificar el elemento y usar la transición CSS3 para el fondo.

transition: background 0.5s linear;

Cuando cambia el fondo, ya sea con toggleClass o con su código, $("#large-img").css('background-image', 'url('+$img+')'); se desvanecerá según lo definido por la clase.

over 4 years ago · Santiago Trujillo Relatório

0

Esta fue la única cosa razonable que encontré para desvanecer una imagen de fondo.

 <div id="foo"> <!-- some content here --> </div>

Tu CSS; ahora mejorado con transición CSS3 .

 #foo { background-image: url(a.jpg); transition: background 1s linear; }

Ahora cambia el fondo

 document.getElementById("foo").style.backgroundImage = "url(b.jpg)";

¡Voilà, se desvanece!


Descargo de responsabilidad obvio: si su navegador no es compatible con la propiedad de transition CSS3, esto no funcionará. En cuyo caso, la imagen cambiará sin transición. Dado que <1% de los navegadores de sus usuarios no son compatibles con CSS3, probablemente esté bien. No te engañes, está bien.

over 4 years ago · Santiago Trujillo Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda