1. jQuery插件概述
- 因为有些功能不是所有人都需要使用,为了减小
jQuery
文件的大小,所以有些功能,另外封装了插件当需要的时候另外引入插件使用 jquery
之家:http://www.htmleaf.com/jquery
插件库:https://www.jq22.com/
2. 懒加载 lazyload()
插件
2.1 概述
- 懒加载适用于长网页,图片较多,页面滚动条到了之后再加载图片,不用一打开网页就加载全部图片,节省网页加载时间
2.2 使用
- 先引入
jQuery.js
文件 - 再引入
jquery.lazyload.js
文件 - 使用插件:
a. 把需要懒加载的img
标签的src
名称改成data-original
b. 给需要懒加载的img
标签添加一个统一的类
c. 在jQuery
中:$(".类名").lazyload()
3. 背景颜色渐变(动画效果)插件
3.1 概述
jQuery
封装的animate
方法不支持背景颜色渐变,它封装了另一个插件jquery.color.js
3.2 使用
- 先引入
jQuery.js
文件 - 再引入
jquery.color.js
文件 - 使用
animate
方法就可以实现背景颜色渐变动画了,里面的颜色最好使用十六进制
4. jQuery
插件制作
4.1 概述
jQuery
插件的实质就是给jQuery
的原型prototype
添加方法
4.2 插件制作
- 插件制作:
jQuery.prototype.自定义方法名 = function(){}
- 或者:
$.prototype.自定义方法名 = function(){}
4.3 jQuery
里面封装了prototype
的简写fn
- 简写:
jQuery.fn.自定义方法名 = function(){}
- 或者:
$.fn.自定义方法名 = function(){}