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 相关文章推荐
javascript replace方法与正则表达式
Feb 19 Javascript
javascript学习笔记(九) js对象 设计模式
Jun 19 Javascript
Js判断参数(String,Array,Object)是否为undefined或者值为空
Nov 04 Javascript
一个JS函数搞定网页标题(title)闪动效果
May 13 Javascript
bootstrap学习笔记之初识bootstrap
Jun 21 Javascript
JavaScript实现的鼠标响应颜色渐变效果完整实例
Feb 18 Javascript
详解vuelidate 对于vueJs2.0的验证解决方案
Mar 09 Javascript
vue父组件向子组件动态传值的两种方法
Nov 11 Javascript
JavaScript EventEmitter 背后的秘密 完整版
Mar 29 Javascript
js设置鼠标悬停改变背景色实现详解
Jun 26 Javascript
解决Layui当中的导航条动态添加后渲染失败的问题
Sep 25 Javascript
vue搜索页开发实例代码详解(热门搜索,历史搜索,淘宝接口演示)
Apr 11 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
从C/C++迁移到PHP——判断字符类型的函数
2006/10/09 PHP
举例详解PHP脚本的测试方法
2015/08/05 PHP
php简单复制文件的方法
2016/05/09 PHP
javascript eval(func())使用示例
2013/12/05 Javascript
js+html5绘制图片到canvas的方法
2015/06/05 Javascript
js实现人民币大写金额形式转换
2016/04/27 Javascript
前端微信支付js代码
2016/07/25 Javascript
基于JavaScript实现数码时钟效果
2020/03/30 Javascript
[js高手之路]HTML标签解释成DOM节点的实现方法
2017/08/31 Javascript
详解webpack打包后如何调试的方法步骤
2018/11/07 Javascript
Vue实现购物车的全选、单选、显示商品价格代码实例
2019/05/06 Javascript
element-ui如何防止重复提交的方法步骤
2019/12/09 Javascript
nodejs nedb 封装库与使用方法示例
2020/02/06 NodeJs
JavaScript中reduce()的5个基本用法示例
2020/07/19 Javascript
js+css3实现炫酷时钟
2020/08/18 Javascript
[04:36]DOTA2国际邀请赛 ti3精彩集锦
2013/08/19 DOTA
Python中使用HTMLParser解析html实例
2015/02/08 Python
Python中死锁的形成示例及死锁情况的防止
2016/06/14 Python
Python算法之图的遍历
2017/11/16 Python
django利用request id便于定位及给日志加上request_id
2018/08/26 Python
Python操作Sqlite正确实现方法解析
2020/02/05 Python
PyCharm无法引用自身项目解决方式
2020/02/12 Python
Pycharm自动添加文件头注释和函数注释参数的方法
2020/10/23 Python
香港万宁官方海外旗舰店:香港健与美连锁店
2018/09/27 全球购物
会展中心部门工作职责
2013/11/27 职场文书
新郎新娘婚礼答谢词
2014/01/11 职场文书
幼儿园中秋节活动方案2013
2014/01/29 职场文书
求职信的最佳写作思路
2014/02/01 职场文书
党的群众路线教育实践活动心得体会
2014/03/03 职场文书
股权转让协议书范本
2014/04/12 职场文书
销售内勤岗位职责
2014/04/15 职场文书
旷课检讨书范文
2014/10/30 职场文书
本科毕业论文导师评语
2014/12/31 职场文书
二年级语文上册复习计划
2015/01/19 职场文书
对学校的意见和建议
2015/06/04 职场文书
Python实现Hash算法
2022/03/18 Python