<html>
<head>
<title>jquery plugins</title>
<style type="text/css">
#main{
width:300px;
height:120px;
}
.main_box{
width:120px;
height:100px;
background:#CCC;
margin:5px;
float:left;
color:#fff;
text-align:center;
}
.test{
background:#000;
}
.test2{
background:#888;
}
</style>
<script type="text/javascript" src="jquery-1.4.4.min.js"></script>
<script type="text/javascript">
<!--
//定义作用域:定义一个JQuery插件,首先要把这个插件的代码放在一个不受外界干扰的地方。
(function($){
//内部方法
var setFontColor = function(obj,color){
$(obj).css({"color":color});
}
//定义插件
$.fn.setBackGround = function (options) {
//默认参数
var defaults = {
className:'test'
};
//覆盖defaults中的对应属性,并替换options。可以理解成合并覆盖
options = $.extend(defaults, options);
$(this).addClass(options.className);
//支持链接调用
return this.each(function(){
setFontColor(this,"red");
});
}
})(jQuery);
$(document).ready(function(){
//调用方式
//#main
$(".main_box").setBackGround({className:'test2'})//插件调用
.css({ "border-width": "1", "border-color": "red", "border-bottom-style": "dotted" });//链接调用
});
//-->
</script>
</head>
<body>
<div id="main">
<div class="main_box">a</div>
<div class="main_box">b</div>
<div>
</body>
</html>
分享到:
相关推荐
总的来说,自定义jQuery插件是一种强大且灵活的方式,可以扩展jQuery的功能,满足特定项目的需求。在本例中,我们创建了一个Notification插件,使得在jQuery应用中添加通知功能变得更加便捷。通过这种方式,你可以...
总结,文章提供的自定义jQuery插件方法可以作为开发者在处理需要强制重绘对象时的参考。理解上述知识点有助于开发者更好地控制网页元素的显示效果,并且可以将这些技术应用于多种复杂场景中。需要注意的是,在实际...
`jquery.easydropdown.min.js`是一个轻量级的jQuery插件,它的主要功能是将传统的Select元素转换为具有自定义样式的下拉菜单。这个插件通过JavaScript和CSS实现了高度可定制的外观和行为,同时保持了原生Select的...
jQuery自定义下拉框插件 jQuery自定义下拉框插件 jQuery自定义下拉框插件 jQuery自定义下拉框插件 jQuery自定义下拉框插件 jQuery自定义下拉框插件
微信公众号自定义菜单jQuery插件,可以多账号使用, 消息包含:图文消息、图片、语音、视频、网页链接,编辑后可以实时在线预览功能,保存、同步、清空菜单等功能则需要自己实现后台代码。
在这个项目中,我们有一个名为“自定义jquery-wizard插件”的实现,通过提供的资源文件,我们可以看到一个完整的实现案例。 1. **主要文件解析:** - **jquery-wizard.1.0.css**:这是样式表文件,包含了插件的...
微信公众号自定菜单jQuery插件,完善图文消息、图片、语音、视频,在线预览,很好用,插件下载即可使用,js中存在预览数据,如需使用后台则打开AJAX代码,后台代码需自己完善。。
自定义下拉菜单jquery插件 自定义下拉菜单jquery插件
Jquery自定义插件经典参考,为个人在项目开发中依据需要定制开发基于html代码形式,完全可见表格插件,不影响原来的编程习惯。与原有的MVC框架无缝结合就可以达现Grid表格的所有效果功能.一行 dataGrid = $("#dg")....
本主题聚焦于“JQUERY插件之自定义滚动条DEMO”,这涉及到如何使用jQuery来实现一个自定义的滚动条,以替代浏览器默认样式,并确保在不同浏览器如IE、Firefox、Chrome和百度浏览器中的兼容性。 首先,我们了解滚动...
在本项目中,我们关注的是一个基于jQuery的自定义下拉框插件,它提供了丰富的功能和视觉效果,使得用户界面更加友好和吸引人。 该插件的主要特点是其“带图标”的特性。在传统的下拉框中,每个选项通常只包含纯文本...
UI JQuery自定义滚动条插件是 jquery自定义滚动条的UI JQuery插件。 UI JQuery自定义滚动条插件演示图: 点击查看演示:
这篇“jQuery插件开发学习”的主题旨在帮助开发者深入理解如何利用jQuery来开发自定义插件,提高代码复用性和项目效率。下面我们将详细探讨jQuery插件开发的相关知识点。 首先,了解jQuery的核心概念是至关重要的。...
本话题聚焦于一个jQuery插件,即"jquery 右键自定义上下文菜单插件",这个插件允许开发者为网页中的元素创建个性化的右键菜单,提供了丰富的定制选项和便捷的API接口。 首先,让我们理解一下“上下文菜单”的概念。...
【标题】中的“可自定义jQuery响应式幻灯片插件”是指一种基于jQuery库的JavaScript组件,设计用于创建响应式、动态切换的图片或内容展示区域,通常被称为轮播图或滑动展示。这样的插件允许开发者根据需要调整样式、...
自定义jQuery插件 如果你需要创建自己的jQuery插件,可以按照以下步骤: 1. 定义一个函数,作为插件的核心。 2. 使用`$.fn.extend`将函数添加到jQuery原型链上。 3. 在函数内部,获取当前选择的元素集,并根据...
该jQuery插件确保在Internet Explorer 8及更高版本、Firefox、Chrome、Safari和Opera等主流浏览器中都能正常工作。这使得它在广泛的用户群体中具有良好的兼容性,无论用户的设备或浏览器偏好如何,都能提供一致的...
一款用于表格数据自定义排序的jQuery插件,仿EasyUI,数据列启用自定义排序后,该列标题后将出现向上或者向下的三角形,点击列标题设置新的排序参数。附的例子是asp.net mvc的,但插件是基于jQuery 的,当然可以用于...