ECHO.JS puro JavaScript Código de instância de carregamento preguiçoso e preguiçoso
Demonstração
<! Doctype html> <html lang = "zh-cn"> <head> <meta charset = "utf-8"> <title> javascript simples biblioteca de carregamento preguiçoso echo.js </title> <yoy> .demo img {width: 736px; Altura: 490px; Antecedentes: URL (imagens/carregamento.gif) 50% no-repetição;} </style> </head> <body> <h1 style = "margin: 40px; font: 32px Microsoft yahei; text-align: Center;"> Simple JavaScript Image Lazy Lazy Library iCo.js Demo </h1 " Data-echo = "Images/big-1.jpg"> <img src = "imagens/em branco.gif" data-echo = "imagens/big-2.jpg"> <img src = "imagens/em branco.gif" data-echo = "imagens/big-3.jpg"> <img src = "/blabt /.gif "-Cho -cho" e "imagens" e "imagens" e "imagens" e "Images-Pergif/blang-echo =" imagens/big-3.jpg "> <img src =" "/blank.gif" dados -cho "e" imagens "e" imagens "e" Images-Pergif/blang-echo = "Data-Cho "g" e "Images-gif" e "Images-Pergif" e "Images-Pergif/blang-4. src="images/blank.gif" data-echo="images/blank.gif" data-echo="images/big-5.jpg"> <img src="images/blank.gif" data-echo="images/big-6.jpg"> <img src="images/blank.gif" data-echo="images/big-7.jpg"></div><script src = "js/echo.min.js"> </script> <cript> echo.init ({offset: 0, acelerador: 0}); </sCript>aplicativo
1. Introduzir JS e inicializar
<script src = "{sh :: pub} js/echo.min.js"> </script> <cript> echo.init ({offset: 0, acelerador: 0}); </sCript>2. Anexe atributos à imagem
<img src = "{sh :: pub} img/common/blank.gif" data-echo = "{sh: $ goods.logoimg}">3. Defina o fundo padrão para imagens descarregadas, GIFs dinâmicos
.Lazy {Larth: 100%; Altura: 100%; Antecedentes: URL ({sh :: pub} img/Common/loading.gif) 50%no-repetir;}Muito conveniente e prático.
Para melhorar ainda mais a velocidade da abertura das páginas da Web, você pode otimizar as imagens carregadas.
A página da web é lenta, nada mais é do que isso, a consulta é lenta, a imagem está carregando lentamente, a imagem não é carregada com atraso e os dados da imagem são muito grandes.
Com base nessas razões, resolva -os gradualmente.
Melhorar a experiência do usuário.
O código de exemplo acima para JavaScript Pure Lightweight Lazy Carreging of Echo.js é o conteúdo inteiro compartilhado pelo editor. Espero que possa lhe dar uma referência e espero que você possa apoiar mais o wulin.com.