`
liuyanhui
  • 浏览: 37628 次
  • 性别: Icon_minigender_1
  • 来自: 沈阳
最近访客 更多访客>>
dj2437
社区版块
存档分类
最新评论

简单的 jQuery 下拉菜单

jQueryAIRIEXHTMLHTML 
阅读更多 
<!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>Simple jQuery Dropdowns</title>
	
	<link rel="stylesheet" href="css/style.css" type="text/css" media="screen, projection"/>
	<!--[if lte IE 7]>
        <link rel="stylesheet" type="text/css" href="css/ie.css" media="screen" />
    <![endif]-->
			
	<script type="text/javascript" src="js/jquery-1.3.1.min.js"></script>	
	<script type="text/javascript" language="javascript" src="js/jquery.dropdownPlain.js"></script>
</head>

<body>

	<div id="page-wrap">
	
        <img src="images/title.png" alt="Simple jQuery Dropdowns" />
	   	   
        <p><a href="index-hoverIntent.html">With hoverIntent</a> | <a href="http://css-tricks.com/simple-jquery-dropdowns/">Article</a> | <a href="http://css-tricks.com/examples/SimplejQueryDropdowns.zip">Download</a></p>     

        <ul class="dropdown">
        	<li><a href="#">For Facilities</a>
        		<ul class="sub_menu">
        			 <li><a href="#">Artificial Turf</a></li>
        			 <li>
        				<a href="#">Batting Cages</a>
        				<ul>
        					<li><a href="#">Indoor</a></li>
        					<li><a href="#">Outdoor</a></li>
        				</ul>
        			 </li>
        			 <li><a href="#">Benches &amp; Bleachers</a></li>
        			 <li><a href="#">Communication Devices</a></li>
        			 <li><a href="#">Dugouts</a></li>
        			 <li><a href="#">Fencing &amp; Windscreen</a></li>
        			 <li><a href="#">Floor Protectors</a></li>
        			 <li><a href="#">Foul Poles</a></li>
        			 <li><a href="#">Netting</a></li>
        			 <li><a href="#">Outdoor Furniture &amp; Storage</a></li>
        			 <li><a href="#">Outdoor Signs</a></li>
        			 <li><a href="#">Padding</a></li>
        			 <li><a href="#">Scoreboards</a></li>
        			 <li><a href="#">Shade Structures</a></li>
        			 <li><a href="#"> - VIEW ALL - </a></li>
        		</ul>
        	</li>
        	<li><a href="#">Field Maintenance</a>
        		<ul class="sub_menu">
        			<li><a href="#">All-in-One Team Cart</a></li>
        			<li><a href="#">Air &amp; Electrical Reels</a></li>
        			 <li><a href="#">Field Drags</a></li>
        			 <li>
        				<a href="#">Field Marking Equipment</a>
        				<ul>
        					<li><a href="#">Batter's Box Templates</a></li>
        					<li><a href="#">Dryline Markers</a></li>
        					<li><a href="#">Field Paint</a></li>
        					<li><a href="#">Field Sprayers</a></li>
        					<li><a href="#">Stencils</a></li>
        				</ul>
        			 </li>
        			 <li>
        				<a href="#">Field Tarps</a>
        				<ul>
        					<li><a href="#">Area Tarps</a></li>
        					<li><a href="#">Growth Covers / Protectors</a></li>
        					<li><a href="#">Infield Tarps</a></li>
        					<li><a href="#">Tarp Accessories</a></li>
        				</ul>
        			 </li>
        			 <li><a href="#">Hand Tools</a></li>
        			 <li>
        				<a href="#">Irrigation, Hoses, Nozzles</a>
        				<ul>
        					<li><a href="#">Hoses &amp; Hose Reels</a></li>
        					<li><a href="#">Irrigation</a></li>
        					<li><a href="#">Nozzles</a></li>
        				</ul>
        			 </li>
        			 <li><a href="#">Layout &amp; Measurement Tools</a></li>
        			 <li><a href="#">Moisture Removal</a></li>
        			 <li><a href="#">Mound &amp; Home Plate Fortification</a></li>
        			 <li><a href="#">Mowers &amp; Stripers</a></li>
        			 <li><a href="#">Soil &amp; Enviornmental Management</a></li>
        			 <li><a href="#">Soil Amendments</a></li>
        			 <li><a href="#">Spreaders &amp; Sweepers</a></li>
        			 <li><a href="#"> - VIEW ALL - </a></li>
        		</ul>
        	</li>
        	<li><a href="#">Game-Practice Equipment</a>
        		<ul class="sub_menu">
        			 <li>
        				<a href="#">Baseball - Softball</a>
        				<ul>
        					<li><a href="#">Base Accessories</a></li>
        					<li><a href="#">Bases &amp; Home Plates</a></li>
        					<li><a href="#">Game Accessories</a></li>
        					<li><a href="#">Pitching Rubbers</a></li>
        				</ul>
        			 </li>
        			 <li>
        				<a href="#">Batting Practice Equipment</a>
        				<ul>
        					<li><a href="#">Backstops</a></li>
        					<li><a href="#">Infield Screens</a></li>
        					<li><a href="#">Jugs Pitching Machines</a></li>
        					<li><a href="#">Turf Mats</a></li>
        					<li><a href="#">Turf Protectors</a></li>
        					<li><a href="#">Replacement Accessories</a></li>
        				</ul>
        			 </li>
        			 <li>
        				<a href="#">Batting Cages</a>
        				<ul>
        					<li><a href="#">Indoor</a></li>
        					<li><a href="#">Outdoor</a></li>
        				</ul>
        			 </li>
        			 <li>
        				<a href="#">Portable Mounds</a>
        				<ul>
        					<li><a href="#">Batting Practice Mounds</a></li>
        					<li><a href="#">Game Mounds</a></li>
        					<li><a href="#">Practice Mounds</a></li>
        				</ul>
        			 </li>
        			 <li>
        				<a href="#">Football</a>
        				<ul>
        					<li><a href="#">First Down Markers</a></li>
        					<li><a href="#">Football Accessories</a></li>
        					<li><a href="#">Football Goalposts</a></li>
        				</ul>
        			 </li>
        			 <li>
        				<a href="#">Soccer</a>
        				<ul>
        					<li><a href="#">Soccer Goals</a></li>
        					<li><a href="#">Soccer Accessories</a></li>
        				</ul>
        			 </li>
        			 <li><a href="#"> - VIEW ALL - </a></li>
        		</ul>
        	</li>
        	<li><a href="#">Training &amp; Conditioning</a>
        		<ul class="sub_menu">
        			 <li><a href="#">Ladders &amp; Sticks</a></li>
        			 <li><a href="#">Hurdles</a></li>
        			 <li><a href="#">Training Accessories</a></li>
        			 <li><a href="#">Smart-Cart Training System</a></li>
        			 <li><a href="#">Smart-Hurdle Collection</a></li>
        			 <li><a href="#"> - VIEW ALL - </a></li>
        		</ul>
        	</li>
        	<li><a href="#">Books-Videos</a>
        		<ul class="sub_menu">
        			 <li><a href="#">Field Design &amp; Maintenance</a></li>
        			 <li><a href="#">Turf Management</a></li>
        			 <li><a href="#">Training</a></li>
        			 <li><a href="#"> - VIEW ALL - </a></li>
        		</ul>
        	</li>
        </ul>
		
	</div>

</body>

</html>
分享到：
| ASP.NET中移除全部缓存
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    简单jquery下拉菜单流畅版

    ### 知识点一：jQuery下拉菜单的基本概念 #### 定义 jQuery下拉菜单是一种常见的用户界面组件，用于提供额外的导航选项或功能设置。这种菜单在鼠标悬停或点击时出现，并且通常包含一系列子菜单项。 #### 功能 - **...

    JQuery下拉菜单插件

    **jQuery下拉菜单插件详解** 在Web开发中，下拉菜单是一种常见的交互元素，用于在有限的空间内展示丰富的选项。jQuery，一个轻量级、高性能的JavaScript库，提供了丰富的API和插件来帮助开发者创建功能强大的下拉...

    jquery下拉菜单,简单的下拉菜单

    通过阅读和分析这些代码，你可以深入理解jQuery下拉菜单的工作原理，并将其应用到自己的项目中。 总之，使用jQuery创建下拉菜单是一个高效且直观的过程。通过理解基本的HTML结构、引入jQuery库以及编写适当的事件...

    25 个免费的 HTML5 CSS3 jQuery 下拉菜单

    在这个主题中，“25个免费的HTML5 CSS3 jQuery下拉菜单”是一个集合，它包含了多种使用这些技术实现的下拉菜单模板，供开发者在构建网站时选用。 HTML5作为最新的超文本标记语言标准，提供了更强大的语义化元素，如...

    jQuery下拉菜单分类搜索框代码_drop_jQuery下拉菜单分类搜索框代码_

    在网页设计中，jQuery下拉菜单分类搜索框是一种常见的交互元素，它提供了高效且用户友好的导航和搜索体验。这个项目可能包含以下组件和知识点： 1. **jQuery库**: jQuery是一个广泛使用的JavaScript库，简化了DOM...

    jQuery多级下拉菜单支持多级下拉列表菜单.zip

    jQuery作为一款强大的JavaScript库，提供了丰富的功能来实现动态、交互式的页面效果，其中包括多级下拉菜单的创建。这个名为"jQuery多级下拉菜单支持多级下拉列表菜单"的资源，就是专门为商城网站或企业网站设计的一...

    jquery 下拉菜单特效

    jQuery 是一个广泛使用的JavaScript库，它为开发者提供了丰富的API和插件，使得创建动态、响应式的下拉菜单变得更加简单。本教程将深入探讨如何使用jQuery实现下拉菜单特效。 首先，理解基本的HTML结构是至关重要的...

    jquery下拉菜单

    在网页设计中，jQuery下拉菜单是一种常见的交互元素，它为用户提供了一种高效的方式来展示大量导航选项，而不会占用过多的页面空间。jQuery是一个强大的JavaScript库，它简化了DOM操作、事件处理、动画效果和Ajax...

    jQuery动画下拉菜单

    压缩包中的"jquery-drill-down-menu-plugin"可能是一个已经封装好的jQuery下拉菜单插件，使用它可以快速构建动画下拉菜单，减少自定义代码的工作量。通常，这样的插件会提供一些配置选项，如动画速度、方向、触发...

    下拉菜单-JQUERY

    实际项目中，jQuery下拉菜单可能需要根据具体需求进行调整，例如多级嵌套、异步加载内容、动态创建菜单等。开发者可以参考各种在线示例和开源插件，如SlickNav、Superfish等，来学习和借鉴不同的实现方式。 总之，...

    jquery 下拉菜单

    "jQuery下拉菜单"是网页交互设计中常见的一个功能，广泛应用于导航栏或者选项选择，为用户提供方便的交互体验。 首先，我们需要了解下拉菜单的基本构成。下拉菜单通常由一个触发元素（如按钮或链接）和隐藏的选项...

    jQuery下拉菜单表单美化插件

    "jQuery下拉菜单表单美化插件"，如"Image DropDown"，正是为了提升这种体验而诞生的工具。这款插件是基于JavaScript库jQuery开发的，其主要目标是将传统的HTML `&lt;select&gt;` 下拉菜单转化为更具吸引力、更易用的交互...

    jQuery自适应横排下拉菜单导航代码

    "jQuery自适应横排下拉菜单导航代码"提供了一个高效且美观的解决方案，尤其适合那些希望提升用户体验的开发者。这个代码利用jQuery库实现，能够根据屏幕尺寸自动调整布局，确保在各种设备上都能良好地展示。 首先，...

    网页模板，jquery下拉菜单

    网页模板和jQuery下拉菜单是构建现代网页设计的重要组成部分，特别是在提升用户体验方面。网页模板提供了一种快速构建网站布局的方法，而jQuery下拉菜单则在导航栏中为用户提供直观且高效的交互体验。 首先，让我们...

    jquery_下拉菜单

    一个简单的下拉菜单通常由`&lt;select&gt;`元素和一系列`&lt;option&gt;`元素组成。但在CSS和jQuery的帮助下，我们可以创建自定义的、更具有视觉吸引力的下拉菜单。`index.html`可能包含了这样的HTML结构： ```html &lt;li&gt;&lt;a ...

    可控制下拉方向的jQuery下拉菜单.zip

    "可控制下拉方向的jQuery下拉菜单"是一个专门解决这一需求的解决方案，它提供了更灵活的设计选择，允许开发者根据页面布局调整下拉菜单的显示方向，无论是向上展开还是向下展开。这种功能尤其在空间有限或者页面布局...

    jquery 实现菜单的下拉菜单

    jquery 实现菜单的的下拉菜单。网上有许多例子，这里仅提供参考。

    jquery实现下拉菜单

    本篇文章将详细探讨如何使用jQuery来创建一个功能完备的下拉菜单。 首先，我们需要了解下拉菜单的基本结构。一个基本的下拉菜单通常由一个主菜单项（通常是按钮或链接）和一组隐藏的子菜单项组成。当用户鼠标悬停在...

    jQuery实现下拉菜单.

    你的jQuery下拉菜单脚本路径.js"&gt; ``` 如果使用的是本地文件，记得将`https://code.jquery.com/jquery-3.6.0.min.js`替换为实际的jQuery文件路径。 通过以上步骤，你已经成功地使用jQuery实现了下拉菜单功能。...

Magicbox
Global site tag (gtag.js) - Google Analytics