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. virtualenv and virtualenvwrapper

    virtualenv 1.下载virtualenv工具 通过物理环境的pip工具安装  清华 国内 pip3 install -i https://pypi.tuna.tsinghua.edu.cn/ ...

  2. JS获取地址栏的参数值

    function GetQueryString(name){ var reg = new RegExp("(^|&)"+ name +"=([^&]*)( ...

  3. linux服务器查看tcp链接shell

    netstat -nt |awk '{++S[$NF]} END {for (a in S ) print a,S[a]}'

  4. 【Android】Android apk默认安装位置设置

    在Android工程中,设置apk的默认安装位置 在AndroidManifest.xml文件Manifest标签中添加android:installLocation属性 android:instal ...

  5. Samba文件共享系统

    前言:今天我们来聊一聊samba这个共享的服务,在企业中的应用还是挺多的,它的出现可以很好的解决不同系统之间的文件传输共享问题: [Samba服务程序组件] Samba服务提供了smbd和nmbd两个 ...

  6. mybatis拦截器处理

    1.自定义注释 package com.hsfw.backyard.biz.security.authority; import java.lang.annotation.*; /** * 数据权限过 ...

  7. 问题 J: Palindromic Password ( 2018组队训练赛第十五场) (简单模拟)

    问题 J: Palindromic Password 时间限制: 3 Sec  内存限制: 128 MB提交: 217  解决: 62[提交][状态][讨论版][命题人:admin] 题目描述 The ...

  8. Codeforces 854C Planning 【贪心】

    <题目链接> 题目大意: 表示有n架飞机本需要在[1,n]时间内起飞,一分钟只能飞一架.但是现在[1,k]时间内并不能起飞,只能在[k+1,k+n]内起飞.ci序号为i的飞机起飞延误一分钟 ...

  9. POJ 1733 Parity game 【带权并查集】+【离散化】

    <题目链接> 题目大意: 一个由0,1组成的序列,每次给出一段区间的奇偶,问哪一条信息不合法. 解题分析: 我们用s[i]表示前i个数的前缀和,那么a b even意味着s[b]和s[a- ...

  10. spring mvc简单介绍xml版

    spring mvc介绍:其实spring mvc就是基于servlet实现的,只不过他讲请求处理的流程分配的更细致而已. spring mvc核心理念的4个组件: 1.DispatcherServl ...