jquery简单插件制作(fn.extend)完整实例


Posted in Javascript onMay 24, 2016

本文实例讲述了jquery简单插件制作方法。分享给大家供大家参考,具体如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
  <script type="text/javascript" src="jquery.js"></script>
  <title>jquery简单的插件制作</title>
  <script type="text/javascript">
  (function ( $ ) {
    $.fn.greenify = function ( options) {
      var settings = $.extend({
       color:"#556b2f",
       backgroundColor:'#000',
       padding:'20px'
      }, options );
      return this.css( {
        color:settings.color,
        backgroundColor : settings.backgroundColor,
        padding : settings.padding
      });
    };
  }( jQuery ));
  $(document).ready(function(){
    $("div").greenify({
      color:"#000",
      backgroundColor:'#ccc',
      padding:'50px'
    })
  });
  </script>
</head>
<body>
<div id="accordion">
jquery简单的插件制作
</div>
</body>
</html>

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
图片无缝滚动代码(向左/向下/向上)
Apr 10 Javascript
跟我学习javascript的闭包
Nov 16 Javascript
JavaScript位移运算符(无符号) &gt;&gt;&gt; 三个大于号 的使用方法详解
Mar 31 Javascript
JavaScript验证知识整理
Mar 24 Javascript
VUE axios上传图片到七牛的实例代码
Jul 28 Javascript
js微信应用场景之微信音乐相册案例分享
Aug 11 Javascript
Webpack框架核心概念(知识点整理)
Dec 22 Javascript
微信小程序使用npm包的方法步骤
Aug 13 Javascript
基于js实现判断浏览器类型代码实例
Jul 17 Javascript
手把手教你实现 Promise的使用方法
Sep 02 Javascript
js实现移动端图片滑块验证功能
Sep 29 Javascript
如何实现小程序与小程序之间的跳转
Nov 04 Javascript
jQuery获取及设置表单input各种类型值的方法小结
May 24 #Javascript
jQuery+php实时获取及响应文本框输入内容的方法
May 24 #Javascript
jQuery中事件与动画的总结分享
May 24 #Javascript
jQuery根据表单name获取值的方法
May 24 #Javascript
深入理解jquery自定义动画animate()
May 24 #Javascript
深入理解jquery中的事件与动画
May 24 #Javascript
Jquery元素追加和删除的实现方法
May 24 #Javascript
You might like
PHP开启opcache提升代码性能
2015/04/26 PHP
PHP加密解密类实例代码
2016/07/20 PHP
功能强大的php分页函数
2016/07/20 PHP
php版微信自动获取收货地址api用法示例
2016/09/22 PHP
PHP读取word文档的方法分析【基于COM组件】
2017/08/01 PHP
javascript Discuz代码中的msn聊天小功能
2008/05/25 Javascript
JSON 数字排序多字段排序介绍
2013/09/18 Javascript
js去除空格的12种实用方法
2013/11/08 Javascript
根据身份证号自动输出相关信息(籍贯,出身日期,性别)
2013/11/15 Javascript
node+express+ejs制作简单页面上手指南
2014/11/26 Javascript
jQuery实现下拉框选择图片功能实例
2015/08/08 Javascript
JS实现把鼠标放到链接上出现滚动文字的方法
2016/04/06 Javascript
vue.js vue-router如何实现无效路由(404)的友好提示
2017/12/20 Javascript
JavaScript 下载svg图片为png格式
2018/06/21 Javascript
创建echart多个联动的示例代码
2018/11/23 Javascript
node省市区三级数据性能测评实例分析
2019/11/06 Javascript
JavaScript前端开发时数值运算的小技巧
2020/07/28 Javascript
python读取.mat文件的数据及实例代码
2019/07/12 Python
使用Python制作缩放自如的圣诞老人(圣诞树)
2019/12/25 Python
使用python客户端访问impala的操作方式
2020/03/28 Python
关于Python3的import问题(pycharm可以运行命令行import错误)
2020/11/18 Python
python爬虫爬取某网站视频的示例代码
2021/02/20 Python
html5之Canvas路径绘图、坐标变换应用实例
2012/12/26 HTML / CSS
英国殿堂级有机护肤品牌:Rodial
2017/04/17 全球购物
Origins加拿大官网:雅诗兰黛集团高端植物护肤品牌
2017/11/19 全球购物
澳大利亚先进的皮肤和激光诊所购物网站:Soho Skincare
2018/10/15 全球购物
英国邮购活的植物主要供应商:Gardening Direct
2019/01/28 全球购物
教师年终个人自我评价
2013/10/04 职场文书
前台接待的工作职责
2013/11/21 职场文书
财务工作者先进事迹材料
2014/01/17 职场文书
计算机毕业生自荐信范文
2014/03/23 职场文书
新年团拜会主持词
2014/04/02 职场文书
园林专业毕业生自荐信
2014/07/04 职场文书
盗窃案辩护词
2015/05/21 职场文书
读《教育心理学》心得体会
2016/01/22 职场文书
MySQL中使用or、in与union all在查询命令下的效率对比
2021/05/26 MySQL