20151214 jquery插件代码备份
;(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插件代码备份的更多相关文章
- 14种网页图片和文字特效的jQuery插件代码
1.网页图片3d旋转jQuery代码 演示和下载地址 2.存css3实现的tabl选项卡代码 演示和下载地址 3.jQuery标签旋转代码 演示和下载地址 4.鼠标悬浮的图片选项卡代码 演示和下载地址 ...
- 转 jQuery(图片、相册)插件代码实例
jQuery想必大部分前端er都知道甚至很熟悉了,网上有数以万计的优秀的jQuery插件以及教程,今天收集了一些关于图片.相册的jQuery插件代码,希望会对你有所帮助. 1. 3D Gallery ...
- 我利用网上特效开发的Jquery插件
我利用网上特效开发的Jquery插件 代码如下 (function($){ $.fn.Dialogx = function(options) { var defaults={ Width:" ...
- jQuery插件实现图片展开效果，jquery.gallery。仿腾讯QQ空间说说图片展示效果。
公司的项目http://www.umfun.com/,有个说说的页面(和腾讯QQ空间说说一样),里面有个发表图片功能,上传完图片,需要点击展开的效果. 当时手里面事情比较多(公司就我一个前端),忙不过 ...
- 【jQuery基础学习】08 编写自定义jQuery插件
目的:虽然jQuery各种各样的功能已经很完善了,但是我们还是要学会自己去编写插件.这样我们可以去封装一些项目中经常用到的专属的代码,以便后期维护和提高开发效率. jQuery插件的类型: 封装对象方 ...
- Jquery插件学习
前端开发也工作了一段时间,Jquery代码页写了很多,但是都是些的很零散的,不是很好用,网上看了很多人写的Jquery 很好用,而且到每个项目中都可以使用, 本人就感觉很好奇他们是怎么做到的呢,于是自 ...
- 设计一种前端数据延迟加载的jQuery插件(2)
背景 最近看到很多网站都运用到了一种前端数据延迟加载技术,包括淘宝,新浪网等等,这样做的目的可以使得一些未显示的图片随 着滚动条的滚动进行延迟显示. 好处显而易见,可以减少前端对于图片的Http请求, ...
- jquery系列教程7-自定义jquery插件全解：对象函数、全局函数、选择器
点击打开: jquery系列教程1-选择器全解 jquery系列教程2-style样式操作全解 jquery系列教程3-DOM操作全解 jquery系列教程4-事件操作全解 jquery系列教程5-动 ...
- 高仿阴阳师官网轮播图效果的jQuery插件
代码地址如下:http://www.demodashi.com/demo/12302.html 插件介绍 这是一个根据阴阳师官网的轮播效果所扒下来的轮播插件,主要应用于定制个性化场景,目前源码完全公开 ...
随机推荐
- C#初始化数组的三种方式
C#声明数组并初始化,有三种方式. 对于一维数组: using System;using System.Data;using System.Configuration;using System.Web ...
- [转]关于WM_NCHITTEST消息
http://www.cnblogs.com/GnagWang/archive/2010/09/12/1824394.html 我为了移动一个无标题栏的窗体,使用了WM_NCHITTEST消息,这个消 ...
- Microsoft SQL Server，错误:2；SQL Server配置管理器（本地）—远程过程调用失败
本机是先安装sqlserver2008,后安装vs2012 在安装sqlserver2008后,运行sqlserver2008正常,接着安装vs2012,再运行sqlserver2008,问题出现了, ...
- 【原】Spark中Client源码分析（二）
继续前一篇的内容.前一篇内容为: Spark中Client源码分析(一)http://www.cnblogs.com/yourarebest/p/5313006.html DriverClient中的 ...
- 【原】spark-submit提交应用程序的内部流程
我们经常通过spark-submit来提交spark应用程序,那么让我们一起看一下这里面到底发生了什么吧. 知识点: 1.CLI命令行界面启动Spark应用程序 Unix有两种方式:1)spark-s ...
- 【HTML】Advanced1：Text: Time, Mark, and "Presentational"
1.Exploring the depths of HTML5 2.</time> <p>Written by Doctor Who on <time datetime= ...
- （转载）JDK中的设计模式
写的很好,学习道路更轻松一些 原文地址:http://blog.csdn.net/gtuu0123/article/details/6114197 JDK中设计模式 分类: Java相关 设计模式 2 ...
- POJ1155 - TELE(树形DP)
题目大意 电视台要直播一场比赛,电视网络刚好形成了一棵树,其中有M个为客户端,其他的为中转站,其中中转站与中转站以及中转站与客户端之间连接都需要一定费用,每个客户i愿意支付pay[i]元钱,问电视台在 ...
- Codeforces245H - Queries for Number of Palindromes(区间DP)
题目大意 给定一个字符串s,q个查询,每次查询返回s[l-r]含有的回文子串个数(题目地址) 题解 和有一次多校的题目长得好相似,这个是回文子串个数,多校的是回文子序列个数 用dp[i][j]表示,s ...
- Oracle数据库字符串连接方法
转至:http://database.51cto.com/art/201011/232267.htm 和其他数据库系统类似,Oracle字符串连接使用“||”进行字符串拼接,其使用方式和MSSQLSe ...