Jump to content
Pitag346

Carregamento de imagem

Recommended Posts

Olá pessoal, tudo bem? 

Estou com uma dúvida bem bobinha... mas gostaria que me ajudassem a solucionar.

 

Alguns sites utilizam uma forma de carregar as imagens deixando elas embaçadas/desfocadas. Até que são carregadas e elas aparecerem normalmente...

 

Exemplo básico seria esse site: https://www.redbull.com/br-pt/athletes

 

Sabem me explicar como isso é feito, e pra que ? Meu site usa bastante imagens, gostaria de saber se tem algum benefício ou se seria somente estética ... Obrigado! 

 

(Não sei se isso é feito em JavaScript, acredito que sim... perdão se publiquei na área errada).

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By WitherZx
      estou cursando na Rocketseat, e um dos exercícios de la é fazer um sisteminha de conversão de notas, de numérico para alfabético, eu fiz o exercício de duas formas, uma deu certo (com if's), porem quando tentei usar switch, deu erro, sempre caia em 'default', como posso resolver? ps: eu não quero ver a solução do vídeo pq lá provavelmente vai ensinar com if's, e isso eu já sei.
       
      function ConverteNota(nota) {     nota = Number(nota)     let notaA = (nota >= 9 && nota <= 10);     let notaB = (nota >= 8 && nota < 9);     let notaC = (nota >= 7 && nota < 8);     let notaD = (nota >= 6 && nota < 7);     let notaF = (nota < 6 && nota >= 0);       switch (nota) {         case notaA:             console.log('Nota A');             break;           case notaB:             console.log('Nota B');             break;           case notaC:             console.log('Nota C');             break;           case notaD:             console.log('Nota D');             break;           case notaF:             console.log('nota F');             break;           default:             console.log('insira uma nota valida!')             break;     }; };   ConverteNota(10);
    • By Sapinn
      Pessoa de novo eu aqui kk. Acho que essa pergunta é simples mas eu não sei como fazer, já pesquisei em vários cantos mas só achei a resposta em Jquery e eu queria fazer em Javascript puro. Basicamente eu gostaria de transferir dados de uma tabela para um form eu já consegui fazer mas só funciona em um td e eu gostaria nos outros não funcionam. 
      <!DOCTYPE html> <html lang="pt-br"> <head>     <meta charset="UTF-8">     <meta http-equiv="X-UA-Compatible" content="IE=edge">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Document</title> </head> <body>     <table border="1px">         <tr>             <td>Nome</td>             <td>Endereço</td>             <td>Telefone</td>             <td>Adicionar</td>         </tr>         <tr>             <td id="nome_cliente" value="Sapien">Sapinn</td>             <td id="endereco_cliente" value="Rua 01">Rua 01</td>             <td id="tel_cliente" value="(88) 9 9999-9999">(88)9 9999-9999</td>             <td><button onclick="adicionar()">Adicionar</button></td>         </tr>         <tr>             <td id="nome_cliente" value="Sapien">Supremo</td>             <td id="endereco_cliente" value="Rua 01">Rua 05</td>             <td id="tel_cliente" value="(88) 9 9999-9999">(88)9 0000-0000</td>             <td><button onclick="adicionar()">Adicionar</button></td>         </tr>     </table><br><br>     Nome:<input type="text" name="nome" id="nome">     Telefone: <input type="text" name="telefone" id="telefone">     Endereço: <input type="text" name="endereco" id="endereco">     <script>         function adicionar(){                         let nome_cliente = document.getElementById("nome_cliente").innerHTML;             let endereco_cliente = document.getElementById("endereco_cliente").innerHTML;             let tel_cliente = document.getElementById("tel_cliente").innerHTML;             document.getElementById('nome').value = nome_cliente;             document.getElementById('telefone').value = tel_cliente;             document.getElementById('endereco').value = endereco_cliente;             console.log(nome_cliente, endereco_cliente, tel_cliente)                      }     </script> </body> </html>  
    • By jvb
      Olá povo do código, eu confesso que estou sem saber o pq de algumas propriedades do Bootstrap 4.2.1 como por exemplo:
      .img-fluid { max-width:100%; height: auto } não funcionar em outra folha de style, que não seja Bootstrap, a propriedade não esta dentro de @media, essa propriedade eu imaginava ser de uso geral.
      Vejamos que a Página continua linkando para o bootstrap, apenas algumas propriedades não terem efeito em outra folha de styles. 
    • By Sapinn
      Fala galera tudo beleza? Então alguém sabe como adicionar e remover campos de texto com js. Tipo teria um botão com um + "mais" para adicionar novos campos e junto a estes campos teria um ícone com um lixeira para remover, toda vez que fosse clicado nesse ícone o campo seria removido, apenas aquele campo. Encontrei um código para adicionar um campo mas a parte de remover ta dando dor de cabeça
      <!DOCTYPE html> <html lang="pt-br"> <head>     <meta charset="UTF-8">     <meta http-equiv="X-UA-Compatible" content="IE=edge">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Pagina</title>     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css"> </head> <body>     <form id="myForm">         <div id="lines"></div>         <button type="button" onclick="addInput('lines')">+</button>         <input type="submit" value="Enviar">       </form>             <script>           var formLine = 1;                 function addInput(divName) {                 var newdiv = document.createElement('div');                 newdiv.innerHTML += '<input type="text" name="produto" id='+formLine+'>';                 newdiv.innerHTML += ' <i class="bi bi-trash-fill"></i>';                 document.getElementById(divName).appendChild(newdiv);                 formLine++;             }         addInput('lines');       </script> </body> </html>  
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.