前端延遲加載
阿新 • • 發佈：2018-10-22
sha 地址 fse pre 人的 .html inf 然而 shard
一 整合
由於本人的碼雲太多太亂了，於是決定一個一個的整合到一個springboot項目裏面。
附上自己的github項目地址 https://github.com/247292980/spring-boot
附上匯總博文地址 https://www.cnblogs.com/ydymz/p/9391653.html
以整合功能
spring-boot，FusionChart，thymeleaf，vue，ShardingJdbc，mybatis-generator，微信分享授權，drools，spring-security，spring-jpa，webjars，Aspect，drools-drt，rabbitmq，zookeeper，mongodb，mysql存儲過程
這次就來整合下前端的延遲加載
二
之前用的是jquery的lazyload，但是不是全部項目是jq啊？於是，我百度了個輕量記得懶加載包
然而，百度的前端的質量....
下面是最少的代碼實現懶加載
三 代碼
<!DOCTYPE html> <html> <head> <title>Hello World!</title> </head> <body> <a>easy thymeleaf</a> <img class="" src="images/loading.gif"data-echo="images/big.jpg"> <!--此外他們把div套在img外面加個class，而且img也有個class，然後根據這兩個class寫css，修改src什麽，然後還說src默認為blank.gif或者loading.gif.... 但是研究了下，這是因為他們不懂src代表什麽的意思 當然最大的可能是他復制代碼沒想那麽多...這情況反而最正常 --> <!-- src是懶加載前的圖片，多為空或者loading。百度第一的竟然說這兩圖片插件自帶....不過哪怕他是錯的，基本都秒懂怎麽改... data-echo是懶加載後的圖片--> </body> <script src="js/echo.js"></script> <script> Echo.init({ offset: 0,//離可視區域多少像素的圖片可以被加載 throttle: 1000 //圖片延時多少毫秒加載 }); </script> </html>
四 圖片
前端延遲加載