jquery lazy load

LazyLoad是一個Js編寫的Jq插件,它可以延遲加載頁面中的圖片,在瀏覽器可視范圍中的圖片會被加載。
如何使用:LazyLoad依賴于Jquery,在html的結尾處 ,就是在</body>前。
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.lazyload.js"></script>
你必須改變圖片的標簽,圖片的地址必須放到data-original屬性上。給懶加載圖片一個指定的class(例如:lazy)代碼如下:
html:<img class="lazy" alt="" width="640" height="480" data-original="img/example.jpg" />
js:$(function() {
$("img.lazy").lazyload();
})
這會將所有圖進行延遲加載
設置臨界點
默認情況下只有圖片出現在屏幕時才會加載,如果你想提前加載圖片,那么可以設置threshold,這個屬性的單位是px,不過賦值的時候不用帶px ,呵呵。
設置事件來觸發加載
$("img.lazy").lazyload({
event : "click"
});
使用特效
$("img.lazy").lazyload({
effect : "fadeIn"
});

轉載于:https://www.cnblogs.com/ZaraNet/p/9508016.html

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/253741.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/253741.shtml
英文地址,請注明出處:http://en.pswp.cn/news/253741.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

linux內核中的循環緩沖區

Linux內核中的循環緩沖區&#xff08;circular buffer&#xff09;為解決某些特殊情況下的競爭問題提供了一種免鎖的方法。這種特殊的情況就是當生產者和消費者都只有一個&#xff0c;而在其它情況下使用它也是必須要加鎖的。 循環緩沖區定義在include/linux/kfifo.h中&#xf…

js的規范寫法ES5(自己以后按照這樣寫)

1、引號的使用&#xff0c;單引號 優先&#xff08;如果不是引號嵌套&#xff0c;不要使用雙引號&#xff09; 正常情況&#xff1a;console.log(hello there) 雙引號轉碼&#xff1a; $("<div classbox>") 2、空格的使用問題&#xff1a;&#xff08…

刪除本地git的遠程分支和遠程刪除git服務器的分支

在項目中使用git管理代碼后&#xff0c;有些時候會創建很多不同名稱的分支&#xff0c;以此區分各個分支代碼功能。 而隨著代碼的合并&#xff0c;以前的分支就可能不再需要保存了&#xff0c;所以就要對沒有用的分支進行刪除&#xff0c;包括緊急回滾時從中抽取某一個版本記錄…

數字圖像處理——引導濾波

一、概述 引導濾波是由何愷明等人于2010年發表在ECCV的文章《Guided Image Filtering》中提出的&#xff0c;后續于2013年發表。引導過濾器根據局部線性模型原理&#xff0c;通過考慮引導圖像的內容來計算過濾輸出&#xff0c;引導圖像可以是輸入圖像本身或另一個不同的圖像。具…

Ubuntu 18.04換國內源

2019獨角獸企業重金招聘Python工程師標準>>> 參考文檔&#xff1a; https://blog.csdn.net/zhangjiahao14/article/details/80554616 https://blog.csdn.net/xiangxianghehe/article/details/80112149 1.復制源文件備份&#xff0c;以防萬一 我們要修改的文件是sour…

video4linux簡介

Video4linux&#xff08;簡稱V4L),是linux中關于視頻設備的內核驅動,現在已有Video4linux2&#xff0c;還未加入linux內核&#xff0c;使用需自己下載補丁。在Linux中&#xff0c;視頻設備是設備文件&#xff0c;可以像訪問普通文件一樣對其進行讀寫&#xff0c;攝像頭在/dev/v…

動態DPC算法學習

造成壞點的原因 感光元件芯片自身工藝技術瑕疵造成;光線采集存在缺陷;制造商產品差異;壞點分類 hot pixel: 固定保持較高的像素值,一般呈現為畫面高亮的點;dead pixel: 固定保持較低的像素值,一般在畫面中呈現為暗點;noise pixel:信號強度隨光照呈現的變化規律不符合正…

windows 郵槽mailslot 在服務程序內建立后客戶端無權限訪問(GetLastError() == 5)的問題...

郵槽創建在服務程序內&#xff0c;可以創建成功&#xff0c; 但外部客戶端連接時 m_hMailslot CreateFile("\\\\.\\mailslot\\zdpMailslot",GENERIC_WRITE,FILE_SHARE_READ,NULL,OPEN_EXISTING,FILE_ATTRIBUTE_NORMAL,NULL);GetLastError返回錯誤 5 &#xff0c;無權…

遞歸下降分析

對于給定的文法G[E] : E→ET|E-T|TT→T*F| T/F|FF→(E)|i 消除左遞歸后的文法是&#xff1a;E→TE E→TE|-TE|∑ T→FT T→*FT|/FT|∑ F→(E)|i 是否是LL(1)文法&#xff1f; select(E→TE)first(TE){(,i}select(E→TE)first(TE){}select(E→-TE)first(-TE){-}select(E→∑)fol…

SYS簡介

"sysfs is a ram-based filesystem initially based on ramfs. It provides a means to export kernel data structures, their attributes, and the linkages between them to userspace.” --- documentation/filesystems/sysfs.txt 可以先把documentation/filesystems/…

數字后端——布圖規劃

布圖規劃&#xff08;floorplan&#xff09;與布局&#xff08;place&#xff09;在芯片設計中占據著重要的地位&#xff0c;它的合理與否直接關系到芯片的時序收斂、布線通暢、電源穩定以及良品率。所以在整個芯片設計中&#xff0c;從布圖規劃到完成布局一般需要占據整個物理…

利用SSH傳輸文件

在linux下一般用scp這個命令來通過ssh傳輸文件。 1、從服務器上下載文件scp usernameservername:/path/filename /var/www/local_dir&#xff08;本地目錄&#xff09; 2、上傳本地文件到服務器scp /path/filename usernameservername:/path 例如scp /var/www/test.php root19…

App WebView實例化

a&#xff0c;高級設置里的環境變量 jdk的配置 b&#xff0c;下載Google的sdk&#xff0c;里面直接包含eclipse 1&#xff0c;新建一個項目 2&#xff0c;起個名字 3&#xff0c;設么走不做&#xff0c;next 4&#xff0c;只操作選擇顯示的三種方式 5&#xff0c;next什么都不做…

[動態代理三部曲:下] - 從動態代理,看Retrofit的源碼實現

前言 關于動態代理的系列文章&#xff0c;到此便進入了最后的“一出好戲”。前倆篇內容分別展開了&#xff1a;從源碼上&#xff0c;了解JDK實現動態代理的原理&#xff1b;以及從動態代理切入&#xff0c;學會看class文件結構的含義。 如果還沒有看過這倆篇文章的小伙伴&#…

Ti的DM368系列芯片的所有PDF資料匯總

http://www.ti.com/sc/docs/psheets/man_dsp.htm

劉浩(專業打劫三十年)20155307的預備作業02:

我的技能&#xff1f;比大多數人好&#xff1f;經驗是什么&#xff1f;與老師的經驗的共同之處&#xff1f; 我的技能之一就是單詞翻譯王——其實看了婁老師的學習經驗之后便有些自慚形穢了&#xff0c;我目前的單詞量是7300,扇貝上測的&#xff0c;而且測試時是嚴格的“不會就…

數字后端——電源規劃

電源規劃是給整個芯片的供電設計出一個均勻的網絡&#xff0c;它是芯片物理設計中非常關鍵的一部分。電源規劃在芯片布圖規劃后或在布圖規劃過程中交叉完成,它貫穿于整個設計中&#xff0c;需要在芯片設計的不同階段對電源的供電網絡進行分析并根據要求進行修改。&#xff0c;主…

逆向project實戰--Acid burn

0x00 序言 這是第二次破解 crackme 小程序&#xff0c;感覺明顯比第一次熟練。破解過程非常順利&#xff0c;差點兒是分分鐘就能夠找到正確的 serial&#xff0c;可是我們的目標是破解計算過程。以下將具體介紹。 0x01 初次執行 剛開始拿到 crackme 先執行程序。看看有哪些明顯…

PyCharm使用技巧(六):Regullar Expressions的使用

2019獨角獸企業重金招聘Python工程師標準>>> PyCharm v2018.2最新版本下載 使用正則表達式查找和替換文件中的文本 示例代碼 使用正則表達式查找和替換字符串 假設您想用擴展標記<title> </title>替換元素&#xff08;title&#xff09;中的屬性&#x…

內核中_init,_exit中的作用

__init&#xff0c; __initdata等屬性標志&#xff0c;是要把這種屬性的代碼放入目標文件的.init.text節&#xff0c;數據放入.init.data節──這一過程是通過編譯內核時為相關目標平臺提供了xxx.lds鏈接腳本來指導ld完成的。 對編譯成module的代碼和數據來說&#xff0c;當模…