- 浏览: 60289 次
- 性别:
- 来自: 江西
文章分类
最新评论
// JavaScript Document (function($){ /*drop menu packaging*/ $.fn.dropmenu = function(options){ var defaults = { contanier: '', itemsCss: '' } var options = $.extend(defaults,options); this.each(function(){ var obj = $(this); var objspan = obj.children('li').children('span'); /*objspan.each(function(index){ var self = $(this); self.bind('click',function(evt){ if(self.next('ul').size() != 0 ){ var selfParentSilbings = self.parent().siblings(); self.toggleClass(options.itemsCss,''); self.next().toggle(200); selfParentSilbings.children('span').removeClass(options.itemsCss); selfParentSilbings.children('ul').hide(); } }); });*/ objspan.click(function(){ var self = $(this); if(self.next('ul').size() != 0 ){ var selfParentSilbings = self.parent().siblings() self.toggleClass(options.itemsCss,''); self.next().toggle(200); selfParentSilbings.children('span').removeClass(options.itemsCss); selfParentSilbings.children('ul').hide(); } }); }); } $('.tb_space tr:even').addClass('even'); //give table tr:even add style })(jQuery); //html document <ul class="navigation"> <li><span class="current"><a href="javascript:void(0);" title="Geographic Settings">Geographic Settings</a></span> <ul style="display:block"> <li><a href="countryList.html" title="Countries">Countries</a></li> <li><a href="setState.html" title="">setState</a></li> </ul> </li> <li><span><a href="javascript:void(0);" title="Manage City Profiles">Manage City Profiles</a></span> <ul> <li><a href="#" title="Countries">Countries</a></li> <li><a href="#" title="">Countries</a></li> </ul> </li> <li><span><a href="javascript:void(0);" title="Manage Genre Profiles">Manage Genre Profiles</a></span> </li> </ul> //css style .navigation li span,.navigation li li a{width:150px;margin:0 0 2px;padding:2px 14px 2px 26px;} .navigation li span{font-size:1.4em;display:block;line-height:22px;color:#333;background:#fff url(../../images/a_i/a_bg.png) no-repeat -1px -28px;} .navigation li span a:link,.navigation li span a:visited{color:#333;text-decoration:none;line-height:22px;} .navigation li .current{background-position:-1px 0;} .navigation li ul{display:none;} .navigation li li a{display:block;font-size:1.2em;height:1.6em;line-height:1.6em;color:#666;text-decoration:none;background:#fff url(../../images/a_i/a_bg.png) no-repeat 0 -81px;} .navigation li li a:hover,.navigation li li .current{background-position:0 -56px;color:#333;}
写法2
/** * @jQuery Active * @Create 03/26/1011 * @Use function $('#box').funname({item1:'', item2:''}); */ (function($){ $.FunName = function ($ele, options){ this.options = options; alert(this.options.item1); } $.fn.funname = function(options){ if (typeof options === 'string') { options = { url: options }; } var o = $.extend({},$.fn.funname.defaults,options); this.each(function(){ $this = $(this); var FN = new $.FunName($this, o); $this.data('funname', FN); });//元素操作 } $.fn.funname.defaults = { item1: '', item2: '' };//设置传参 })(jQuery);
/* 跟第二种一样 */ (function($){ var a = { duration: 500, play: false, nextPage: "", prePage: "", }; function b(d,e){ this.options = $.extend({}, a, e); this.init(d); } $.extend(b.prototype, { init: function(d){ console.log(this.options.duration); }, play: function(){ }, next: function(){ } }); //return b; $.fn.slideshow = function(arg){ var self = $(this) return new b(self,arg); } })(jQuery); $('.mod-slide').slideshow({});
发表评论
-
粒子喷泉
2011-07-18 17:43 861注:来自http://daimaren.cn/blog/?p= ... -
jquery validate addMethod
2011-06-20 15:18 1536只能输入m-n个字符且至少有一个字母和一个数字 jQuer ... -
4个跨浏览器必备的函数
2011-05-26 13:58 738http://www.cssbaby.com/archives ... -
用jquery实现的文本框只能输入数字
2011-05-25 10:14 2279用jquery实现的文本框只能输入数字简单插件 $.fn. ... -
闭包理解
2011-04-28 11:51 812直接看到代码 var list = document.ge ... -
JS/DOM/Ajax/Framework(Jquery/Yui/Mootools/EXT)
2011-03-28 10:09 1054gotop效果 <script> var B ... -
利用浏览器默认方法获取浏览器当前位置
2011-03-19 13:53 1028支持浏览器 IE FIREFOX SAFARI CHROME ... -
关于用jQuery实现效果
2011-03-19 09:37 7901、效果1:关于新闻信息文字上下切换 <div i ... -
jquery实现键盘上下键、return键选折li
2011-03-16 11:42 6591注释:code来源javaeye 使用前要引入jquery库 ... -
随滚动条移动的层
2011-02-15 09:51 804<!DOCTYPE html PUBLIC &quo ... -
yui的学习脚印
2011-01-30 22:37 958<!DOCTYPE html PUBLIC &quo ... -
vim 使用
2011-01-21 17:08 681vim命令 vi和vim是linux和u ... -
js左右滚动效果
2011-01-21 14:49 1830<!DOCTYPE html PUBLIC &quo ... -
javascript基础知识
2011-01-19 09:45 730注释:来自http://www.csssea.com/?p=7 ... -
Javascript浏览器兼容问题
2011-01-14 00:13 1021Javascript浏览器兼容 1.doc ... -
一个简单的javascript tab选项卡
2011-01-13 20:51 1089<!DOCTYPE html PUBLIC &quo ... -
常用的正则表达式
2011-01-10 13:47 654/** *postal codes regular ... -
一些比较实用的javascript方法
2011-01-10 13:25 906动态加载javascript文件 <script t ... -
javacript实现根据选择不同国家选择显示不同的省/州
2010-12-29 01:13 1451/** * @author wangxiang * ... -
javascript方法(Methods)
2010-12-28 23:49 9661、Array array.concat(item..) co ...
相关推荐
本文将深入探讨一个基于jQuery封装的组件,通过标题"jQuery封装的组件"我们可以推测,这是一个利用jQuery创建的自定义UI元素或功能模块。描述中的链接指向了一篇博客文章,虽然具体内容无法直接提供,但我们可以根据...
本教程将深入讲解如何基于jQuery封装自己的插件,这是一门面向初级开发者的技术分享,旨在帮助初学者理解jQuery插件的创建过程。 首先,我们需要了解jQuery插件的基本结构。一个简单的jQuery插件通常由以下部分组成...
**jQuery封装的地图工具详解** 在Web开发中,地图应用已经成为不可或缺的一部分,无论是地理位置查询、导航服务还是数据分析,都需要借助地图工具。本篇文章将详细介绍如何利用jQuery来封装常用的地图工具,包括...
**jQuery封装好的验证码技术详解** 在网页开发中,验证码是一种常用的安全机制,用于防止自动化的机器人或恶意软件进行非法操作,如防止恶意注册、登录等。`jQuery` 是一款广泛使用的JavaScript库,它简化了DOM操作...
这个压缩包中的 "jquery封装好的js文件" 提供了一个预封装的 jQuery 实例,使得开发者能够更快速、更便捷地在项目中使用 jQuery。 ### jQuery 的核心特性 1. **DOM 操作**:jQuery 提供了一系列简洁的 API 来查找...
注:本文使用的seajs版本是2.1.1一、把Jquery封装成seajs的模块 代码如下:define(function () { //这里放置jquery代码 把你喜欢的jquery版本放进来就好了 return $.noConflict();}); 调用方法:这样引进就可以像...
《jQuery函数:强大的封装与应用》 jQuery,作为一款广泛使用的JavaScript库,以其简洁的语法、丰富的API和高效的性能赢得了开发者们的青睐。标题中的“jquery函数 强大的封装”正揭示了jQuery的核心魅力:它将复杂...
这个Web项目实例展示了如何利用jQuery封装的AJAX功能实现异步加载,通过与Servlet配合,实现了客户端与服务器间JSON数据的交换。理解这些概念和实践,对于提升Web应用的用户体验和性能至关重要。通过深入学习和实践...
### 仿照jQuery封装自己的JS库(一) #### 一、理解jQuery的美元符号 在JavaScript的世界里,jQuery 是一个非常流行的库,它通过简化HTML文档遍历、事件处理、动画以及Ajax交互等功能来帮助开发者更高效地编写网页...
"jquery封装的input file控件"是一种解决方法,通过jQuery库来改进文件上传控件的外观和交互体验。 jQuery是一个流行的JavaScript库,它简化了DOM操作、事件处理、动画效果和Ajax交互等任务。在本案例中,开发者...
这篇博客“AngularJS封装jQuery DateTimepicker”可能是关于如何在AngularJS应用中有效地整合和自定义这个日期时间选择器的教程。 在AngularJS中,我们通常避免直接使用jQuery,因为Angular提供了一套自己的数据...
本资源提供的是jQuery封装的几款弹出层类,适用于快速构建各种类型的弹窗,如信息提示、确认对话框、模态窗口等。这些类可以直接通过`new`关键字实例化并使用,大大提高了开发效率。 首先,我们来理解jQuery封装的...
**AngularJS 封装 jQuery Datepicker 知识点详解** 在Web开发中,日期选择器是一个常见的组件,用于用户输入日期或选择日期范围。AngularJS 和 jQuery 的结合使用可以为开发者提供更强大的功能和更好的用户体验。这...
**jQuery 封装Ajax** 在Web开发中,Ajax(Asynchronous JavaScript and XML)技术被广泛应用于实现页面的异步更新,提升用户体验。jQuery库通过其简单易用的API,极大地简化了Ajax操作,使得开发者无需关注底层的...
本主题聚焦于一个特定的jQuery插件——“基于jQuery封装的tap事件插件”,这个插件是为了应对触屏设备(如智能手机和平板电脑)上的点击事件问题而设计的。在触屏设备上,原生的`click`事件存在延迟,通常在用户触摸...
JavaScript 和 jQuery 在网页开发中广泛应用于创建动态和交互式的用户界面,其中照片轮播就是一种常见且实用的功能。本文将详细讲解如何使用 JavaScript 和 jQuery 实现照片轮播,并结合提供的"一行多图轮播 含有弹...
本教程将聚焦于如何封装一个基于jQuery的滑动插件,也就是"slider插件",这在网页设计中非常常见,用于创建吸引人的幻灯片展示效果。 首先,我们要理解什么是滑动插件(Slider Plugin)。滑动插件通常是一个自定义...
本教程将详细讲解如何使用jQuery封装Tab标签选项卡,包括动画版选项卡和滑动门效果,这在网页设计中是常见的交互元素,能提升用户体验。 首先,Tab选项卡是一种组织内容的有效方式,它允许用户在多个相关但独立的...
在给定的标题“jQuery封装自定义事件--valuechange(动态的监听input,textarea)之前值,之后值的变化”中,讨论的是如何利用jQuery创建一个自定义事件来实时监测input和textarea元素的值变化。这个功能对于表单验证...
以下是对"jquery封装下的ajax同步加载代码实例"的详细解释: 首先,jQuery的$.ajax()函数是进行AJAX请求的核心方法。这个函数接受一个包含多个选项的对象作为参数,用于定制请求的各个方面。在这个实例中,我们将...