20151214 jquery外掛程式碼備份

破玉發表於2015-12-14
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>

　　

相關文章