20151214 jquery插件代码备份

时间：2022-02-24 22:15:16
;(function ($) {

	//局部性的

	/*$.fn.extend({

		'nav' : function (color) {

			$(this).find('.nav').css({

				'list-style' : 'none',

				'margin' : 0,

				'padding' : 0,

				'display' : 'none',

				'color' : color

			});

			$(this).find('.nav').parent().hover(function () {

				$(this).find('.nav').slideDown('normal');

			}, function () {

				$(this).find('.nav').stop().slideUp('normal');

			});

			return this;

		}

	});

	*/

	//全局性的

	$.extend({

		'nav':function(color){

			  $('.nav').css({

		'list-style':'none',

		'margin':0,

		'padding':0,

		'display':'none',

		'color':color

	    });

	    $('.nav').parent().hover(function() {

        $(this).find('.nav').slideDown('normal');

        },function(){

		$(this).find('.nav').stop().slideUp('normal');

		});

		return this;

			}

		});

})(jQuery);

　　

$(function () {

	//alert($('.list').eq(0).nav('orange'));

	/*$('.nav').css({

		'list-style':'none',

		'margin':0,

		'padding':0,

		'display':'none'

	});

	$('.nav').parent().hover(function() {

        $(this).find('.nav').slideDown('normal');

    },function(){

		$(this).find('.nav').stop().slideUp('normal');

		});*/

		//全局性的

		$.nav('orange');

		//局部性的

		//$('.list').eq(0).nav();

});

　　

<!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">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>插件</title>

<script type="text/javascript" src="jquery-1.10.1.js"></script>

<script type="text/javascript" src="jquery.nav.js"></script>

<script type="text/javascript" src="demo.js"></script>

<link rel="stylesheet" href="style.css" type="text/css" />

</head>

<body>

<!--<ul class="list">

	<li>导航列表

		<ul class="nav">

			<li>导航列表1</li>

			<li>导航列表1</li>

			<li>导航列表1</li>

			<li>导航列表1</li>

			<li>导航列表1</li>

			<li>导航列表1</li>

		</ul>

	</li>

	<li>导航列表

		<ul class="nav">

			<li>导航列表2</li>

			<li>导航列表2</li>

			<li>导航列表2</li>

			<li>导航列表2</li>

			<li>导航列表2</li>

			<li>导航列表2</li>

		</ul>

	</li>

	<li>导航列表

		<ul class="nav">

			<li>导航列表3</li>

			<li>导航列表3</li>

			<li>导航列表3</li>

			<li>导航列表3</li>

			<li>导航列表3</li>

			<li>导航列表3</li>

		</ul>

	</li>

	<li>导航列表

		<ul class="nav">

			<li>导航列表4</li>

			<li>导航列表4</li>

			<li>导航列表4</li>

			<li>导航列表4</li>

			<li>导航列表4</li>

			<li>导航列表4</li>

		</ul>

	</li>

	<li>导航列表

		<ul class="nav">

			<li>导航列表5</li>

			<li>导航列表5</li>

			<li>导航列表5</li>

			<li>导航列表5</li>

			<li>导航列表5</li>

			<li>导航列表5</li>

		</ul>

	</li>

</ul>

<p>1</p><p>1</p>

<ul class="list">

	<li>导航列表

		<ul class="nav">

			<li>导航列表1</li>

			<li>导航列表1</li>

			<li>导航列表1</li>

			<li>导航列表1</li>

			<li>导航列表1</li>

			<li>导航列表1</li>

		</ul>

	</li>

	<li>导航列表

		<ul class="nav">

			<li>导航列表2</li>

			<li>导航列表2</li>

			<li>导航列表2</li>

			<li>导航列表2</li>

			<li>导航列表2</li>

			<li>导航列表2</li>

		</ul>

	</li>

</ul>

-->

<ul class="list">

<li>导航列表

<ul class="nav">

<li>导航列表1</li>

<li>导航列表1</li>

<li>导航列表1</li>

<li>导航列表1</li>

<li>导航列表1</li>

<li>导航列表1</li>

</ul>

</li>

<li>导航列表

<ul class="nav">

<li>导航列表2</li>

<li>导航列表2</li>

<li>导航列表2</li>

<li>导航列表2</li>

<li>导航列表2</li>

<li>导航列表2</li>

</ul>

</li>

<li>导航列表

<ul class="nav">

<li>导航列表3</li>

<li>导航列表3</li>

<li>导航列表3</li>

<li>导航列表3</li>

<li>导航列表3</li>

<li>导航列表3</li>

</ul>

</li>

<li>导航列表

<ul class="nav">

<li>导航列表4</li>

<li>导航列表4</li>

<li>导航列表4</li>

<li>导航列表4</li>

<li>导航列表4</li>

<li>导航列表4</li>

</ul>

</li>

<li>导航列表

<ul class="nav">

<li>导航列表5</li>

<li>导航列表5</li>

<li>导航列表5</li>

<li>导航列表5</li>

<li>导航列表5</li>

<li>导航列表5</li>

</ul>

</li>

</ul>

<!--<p>1</p><p>1</p>

<ul class="list">

	<li>导航列表

		<ul class="nav">

			<li>导航列表1</li>

			<li>导航列表1</li>

			<li>导航列表1</li>

			<li>导航列表1</li>

			<li>导航列表1</li>

			<li>导航列表1</li>

		</ul>

	</li>

	<li>导航列表

		<ul class="nav">

			<li>导航列表2</li>

			<li>导航列表2</li>

			<li>导航列表2</li>

			<li>导航列表2</li>

			<li>导航列表2</li>

			<li>导航列表2</li>

		</ul>

	</li>

</ul>-->

</body>

</html>

　　

20151214 jquery插件代码备份的更多相关文章

  1. 14种网页图片和文字特效的jQuery插件代码

    1.网页图片3d旋转jQuery代码 演示和下载地址 2.存css3实现的tabl选项卡代码 演示和下载地址 3.jQuery标签旋转代码 演示和下载地址 4.鼠标悬浮的图片选项卡代码 演示和下载地址 ...

  2. 转 jQuery&lpar;图片、相册&rpar;插件代码实例

    jQuery想必大部分前端er都知道甚至很熟悉了,网上有数以万计的优秀的jQuery插件以及教程,今天收集了一些关于图片.相册的jQuery插件代码,希望会对你有所帮助. 1. 3D Gallery ...

  3. 我利用网上特效开发的Jquery插件

    我利用网上特效开发的Jquery插件 代码如下 (function($){ $.fn.Dialogx = function(options) { var defaults={ Width:" ...

  4. jQuery插件实现图片展开效果，jquery&period;gallery。仿腾讯QQ空间说说图片展示效果。

    公司的项目http://www.umfun.com/,有个说说的页面(和腾讯QQ空间说说一样),里面有个发表图片功能,上传完图片,需要点击展开的效果. 当时手里面事情比较多(公司就我一个前端),忙不过 ...

  5. 【jQuery基础学习】08 编写自定义jQuery插件

    目的:虽然jQuery各种各样的功能已经很完善了,但是我们还是要学会自己去编写插件.这样我们可以去封装一些项目中经常用到的专属的代码,以便后期维护和提高开发效率. jQuery插件的类型: 封装对象方 ...

  6. Jquery插件学习

    前端开发也工作了一段时间,Jquery代码页写了很多,但是都是些的很零散的,不是很好用,网上看了很多人写的Jquery 很好用,而且到每个项目中都可以使用, 本人就感觉很好奇他们是怎么做到的呢,于是自 ...

  7. 设计一种前端数据延迟加载的jQuery插件&lpar;2&rpar;

    背景 最近看到很多网站都运用到了一种前端数据延迟加载技术,包括淘宝,新浪网等等,这样做的目的可以使得一些未显示的图片随 着滚动条的滚动进行延迟显示. 好处显而易见,可以减少前端对于图片的Http请求, ...

  8. jquery系列教程7-自定义jquery插件全解：对象函数、全局函数、选择器

    点击打开: jquery系列教程1-选择器全解 jquery系列教程2-style样式操作全解 jquery系列教程3-DOM操作全解 jquery系列教程4-事件操作全解 jquery系列教程5-动 ...

  9. 高仿阴阳师官网轮播图效果的jQuery插件

    代码地址如下:http://www.demodashi.com/demo/12302.html 插件介绍 这是一个根据阴阳师官网的轮播效果所扒下来的轮播插件,主要应用于定制个性化场景,目前源码完全公开 ...

随机推荐

  1. window10 安装SVN 提示权限问题

     http://www.yishimei.cn/network/551.html 经常在网上看到有同学反映,他们在控制面板里卸载软件的时候,总是会出现2502.2503错误代码的问题,并且这个问题大多 ...

  2. Alpha版本测试报告

    请根据团队项目中软件的需求文档.功能规格说明书和技术规格说明书,写出软件的测试计划.测试过程和测试结果,并回答下述问题. 1. 在测试过程中发现了多少Bug? 2. 你是怎么进行场景测试(scenar ...

  3. js对象遍历

    js对象遍历可以使用比较普遍的方法:如下 var ss={aa:"aa",bb:"bb"}; for(var s in ss){ console.info(&q ...

  4. Java访问USB设备

    最近在用Java访问RDing设备,使用的是Java HID API.使用过程中发现一个问题,由于是嵌入式小白,不知道如何向USB设备发送report.于是想到可以看看自带的软件如何访问USB的.找到 ...

  5. 小白日记33：kali渗透测试之Web渗透-扫描工具-Burpsuite（一）

    扫描工具-Burpsuite Burp Suite是Web应用程序测试的最佳工具之一,成为web安全工具中的瑞士军刀.其多种功能可以帮我们执行各种任务.请求的拦截和修改,扫描web应用程序漏洞,以暴力 ...

  6. jsoncpp第二篇------API

    更多API参考jsoncpp头文件 1  jsoncpp的api简要说明 1,解析(json字符串转为对象) std::string strDataJson; Json::Reader JReader ...

  7. 运维工作笔记——基于centos7&period;3的多台服务期时间同步

    1. 确认服务器版本 2.查看本机时间 3.可以同过date进行时间更改 4.yum安装ntp服务(服务端与客户端都需要安装)       yum install -y ntp 5.在服务端192.1 ...

  8. sjms-1 面向对象

    面向对象设计 先设计架构,然后去完成相应模块和类 设计模式:对软件设计中普遍存在(反复出现)的各种问题,所提出的解决方案.每一个设计模式系统地命名.解释和评价了面向对象系统中一个重要的和重复出现的设计 ...

  9. node&period;js&lpar;一&rpar;

    安装官网: https://nodejs.org/en/ 运行代码: var http=require('http') http.createServer(function(req,res){ res ...

  10. 跨域问题 Uncaught DOMException&colon; Blocked a frame with origin。。。

    第三方系统内嵌 到iframe中的 跨域问题. 解决方案: http://www.ruanyifeng.com/blog/2016/04/same-origin-policy.html

相关文章