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的更多相关文章

  1. iOS framework静态库中使用xib和图片资源详解

    一.新建bundle 前2篇文章介绍了iOS 最新framework和.a静态库制作及使用全解   iOS 工程套子工程,主工程和framework工程或.a library静态库工程联调 我现在是在 ...

  2. 023_数量类型练习——Hadoop MapReduce手机流量统计

    1) 分析业务需求:用户使用手机上网,存在流量的消耗.流量包括两部分:其一是上行流量(发送消息流量),其二是下行流量(接收消息的流量).每种流量在网络传输过程中,有两种形式说明:包的大小,流量的大小. ...

  3. Django的admin源码浅析和模仿

    admin模块: admin提供了5种接口 list_display, 指定数据展示字段,不能放多对多字段

随机推荐

  1. CTAP: Complementary Temporal Action Proposal Generation (ECCV2018)

    互补时域动作提名生成 这里的互补是指actionness score grouping 和 sliding window ranking这两种方法提proposal的结合,这两种方法各有利弊,形成互补 ...

  2. 查询Linux系统中glibc的版本

    编写一个简单的程序 #include <stdio.h> int main() { printf("Hello world\n"); ; } 编译 gcc test.c ...

  3. WebApi接口返回值不困惑：返回值类型详解

    前言:已经有一个月没写点什么了,感觉心里空落落的.今天再来篇干货,想要学习Webapi的园友们速速动起来,跟着博主一起来学习吧.作为程序猿,我们都知道参数和返回值是编程领域不可分割的两大块,此前分享了 ...

  4. Apache ActiveMQ 远程代码执行漏洞 (CVE-2016-3088)案例分析

    部署ActiveMQ运行环境 在linux上部署apache-activemq-5.10.0-bin.tar.gz 通过tar -zxvf  apache-activemq-5.10.0-bin.ta ...

  5. Spring Boot之 Controller 接收参数和返回数据总结(包括上传、下载文件)

            一.接收参数(postman发送) 1.form表单 @RequestParam("name") String name 会把传递过来的Form表单中的name对应 ...

  6. jenkins(1): jenkins安装以及从gitlab拉取代码

    1. gitlab前面已经写过了,自己去参考 https://www.cnblogs.com/yitianyouyitian/p/9214940.html 2. jenkins安装 2.1 jdk 安 ...

  7. phpmyadmin详细的图文使用教程

    做网站用到服务器有很多站长应该都会用到数据库,那么phpmyadmin的使用也会是很多新手站长头大的问题,下面小编详细介绍一下phpmyadmin详细的图文使用教程. 方法/步骤     如何进入ph ...

  8. Codeforces 980E The Number Games 贪心 倍增表

    原文链接https://www.cnblogs.com/zhouzhendong/p/9074226.html 题目传送门 - Codeforces 980E 题意 $\rm Codeforces$ ...

  9. psp表格记录-

    PSP2.1 Personal Software Process Stages Time Planning 计划 · Estimate · 估计这个任务需要多少时间 12 Development 开发 ...

  10. python面试题之python下多线程的限制

    python多线程有个全局解释器锁(global interpreter lock). 这个锁的意思是任一时间只能有一个线程使用解释器,跟单cpu跑多个程序一个意思,大家都是轮着用的,这叫“并发”,不 ...