|
有很多種方法來實(shí)現(xiàn)圖片的預(yù)加載,通常大部分使用Javascript讓事情滾動。不要再受Javascript預(yù)載的束縛了吧,用CSS你就可以毫不麻煩的預(yù)載你的圖片。
為什么使用預(yù)載你為什么會考慮使用預(yù)載呢?你是否曾有個網(wǎng)站,在那個網(wǎng)站你要滾動你的導(dǎo)航然后有個延遲直到圖片被加載完……嘿嘿。預(yù)載將在這方面幫助你。它將在頁面加載的時候加載那些圖片并將其存儲在瀏覽器的緩存里面。這樣當(dāng)用戶滾動導(dǎo)航的時候,很漂亮而且流暢,沒有延遲。)
CSS代碼這個概念就是寫一個CSS樣式設(shè)置一批背景圖片,然后將其隱藏,這樣你就看不到那些圖片了。那些背景圖片就是你想預(yù)載的圖片。
這是一個例子:
#preloader {
/* Images you want to preload*/3
background-image: url(image1.jpg);
background-image: url(image2.jpg);
background-image: url(image3.jpg);
width: 0px;
height: 0px;
display: inline
}
it知識庫:拋棄Javascript預(yù)載吧,牛人純CSS圖片預(yù)加載,轉(zhuǎn)載需保留來源!
鄭重聲明:本文版權(quán)歸原作者所有,轉(zhuǎn)載文章僅為傳播更多信息之目的,如作者信息標(biāo)記有誤,請第一時間聯(lián)系我們修改或刪除,多謝。