JQ04
1、JQ插件
使用插件扩展jq的功能
1）插入插件的步骤：
引入JQ文件，引入插件，若有用到css，需要引入css.使用插件。
2）jquery.color.js
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
div {
width: 400px;
height: 400px;
background-color: red;
}
</style>
</head>
<body>
<div></div>
<!--1. 引入jquery的js文件-->
<script src="jquery-1.12.4.js"></script>
<!--2. 引入插件的js文件-->
<script src="jquery.color.js"></script>
<script>
$(function () {
//3. 直接使用即可。
//说明jquery不支持颜色的渐变,颜色最好用16进制
$('div').animate({backgroundColor:"#ffc0cb"}, 3000, function () {
alert("呵呵");
});
});
</script>
</body>
</html>
jq不支持颜色的渐变。引入插件时，必须要在引入jq后再引入
3）jquery.lazyload.js
懒加载插件，打开网页时仅加载可视区域内的图片
js通常放在body标签最后加载。
使用方法：引入后，在需要使用懒加载的图片标签内写：4
<img data.oringinal="src"...>不需再写src属性,可使用标签以便批量懒加载
$(function(){$("img").lazyload();
});
3、jquery插件制作
1）利用原型添加方法
例：
jquery.prototype.sayHi=function()+{
}
jq插件的实质，就是给jq的原型上增加方法
或者直接：
$.fn===prototype
$.fn.函数=function(){
…
]
在方法中this指代的是调用方法的实例对象
现在将代码封装为一个插件并使用
首先需要新建一个js文件将代码放入并命名
使用方法也与使用普通插件一致。要特别注意链式编程的问题，需要返回一个对象，最后返回一个
return this;//即可
4、手风琴插件封装
1） JQ重复使用一个对象可以用变量接收
JQ04的更多相关文章
- iOS framework静态库中使用xib和图片资源详解
一.新建bundle 前2篇文章介绍了iOS 最新framework和.a静态库制作及使用全解 iOS 工程套子工程,主工程和framework工程或.a library静态库工程联调 我现在是在 ...
- 023_数量类型练习——Hadoop MapReduce手机流量统计
1) 分析业务需求:用户使用手机上网,存在流量的消耗.流量包括两部分:其一是上行流量(发送消息流量),其二是下行流量(接收消息的流量).每种流量在网络传输过程中,有两种形式说明:包的大小,流量的大小. ...
- Django的admin源码浅析和模仿
admin模块: admin提供了5种接口 list_display, 指定数据展示字段,不能放多对多字段
随机推荐
- Failed to create Accelerated Display. Please check the display hardware and drivers meet the minimum requirements.
ArcGIS Runtime for WPF开发中Map设置了属性UseAcceleratedDisplay="True",报错: Sample: LocalMap Error: ...
- h5调用qq客户端
这是第一种: <a href="tencent://message/?uin=1014167202&Site=在线QQ&Menu=yes"> <i ...
- HDU2853 Assignment KM
原文链接http://www.cnblogs.com/zhouzhendong/p/8284105.html 题目传送门 - HDU2853 题意概括 (来自谷歌翻译) 题解 这是一道好题. 我们首先 ...
- Python图表数据可视化Seaborn：2. 分类数据可视化-分类散点图|分布图（箱型图|小提琴图|LV图表）|统计图（柱状图|折线图）
1. 分类数据可视化 - 分类散点图 stripplot( ) / swarmplot( ) sns.stripplot(x="day",y="total_bill&qu ...
- Linux下java开发环境配置总结
1 安装JDK,卸载以前的jdk,安装jdk1.8 : 参考:http://www.jb51.net/os/RedHat/73016.html 需要注意配置环境变量中的路径要和当前安装的jdk路径一致 ...
- Spark-Unit1-spark概述与安装部署
一.Spark概述 spark官网:spark.apache.org Spark是用的大规模数据处理的统一计算引擎,它是为大数据处理而设计的快速通用的计算引擎.spark诞生于加油大学伯克利分校AMP ...
- Java中System类的相关应用
1.Runtime: public class RuntimeDemo { public static void main(String[] args) { Runtime runtime=Runti ...
- TF之RNN：matplotlib动态演示之基于顺序的RNN回归案例实现高效学习逐步逼近余弦曲线—Jason niu
import tensorflow as tf import numpy as np import matplotlib.pyplot as plt BATCH_START = 0 TIME_STEP ...
- CodeForces 1117C Magic Ship (循环节+二分答案)
<题目链接> 题目大意: 给定起点和终点,某艘船想从起点走到终点,但是海面上会周期性的刮风,船在任何时候都能够向四个方向走,或者选择不走,船的真正行走路线是船的行走和风的走向叠加的,求船从 ...
- linux 学习笔记 查看文件篇
1 diff 比较两个文件 #diff -y test.txt test.txt 输出源文件和目标文件的全部.分左右两栏. aaaa aaaa bbb | b ccc < > ddd 注 ...