<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>1-5-1</title>
<style type="text/css">
#menu {
width:300px;
}
.has_children{
background : #555;
color :#fff;
cursor:pointer;
}
.highlight{
color : #fff;
background : green;
}
div{
padding:0;
}
div a{
background : #888;
display : none;
float:left;
width:300px;
}
</style>
<!-- 引入 jQuery -->
<script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script>
<script type="text/javascript">
//等待dom元素加载完毕.
$(document).ready(function(){
$(".has_children").click(function(){
$(this).addClass("highlight") //为当前元素增加highlight类
.children("a").show().end() //将子节点的a元素显示出来并重新定位到上次操作的元素
.siblings().removeClass("highlight") //获取元素的兄弟元素，并去掉他们的highlight类
.children("a").hide(); //将兄弟元素下的a元素隐藏
});
});
</script>
</head>
<body>
<div id="menu">
<div class="has_children">
<span>第1章-认识jQuery</span>
<a>1.1-JavaScript和JavaScript库</a>
<a>1.2-加入jQuery</a>
<a>1.3-编写简单jQuery代码</a>
<a>1.4-jQuery对象和DOM对象</a>
<a>1.5-解决jQuery和其它库的冲突</a>
<a>1.6-jQuery开发工具和插件</a>
<a>1.7-小结</a>
</div>
<div class="has_children">
<span>第2章-jQuery选择器</span>
<a>2.1-jQuery选择器是什么</a>
<a>2.2-jQuery选择器的优势</a>
<a>2.3-jQuery选择器</a>
<a>2.4-应用jQuery改写示例</a>
<a>2.5-选择器中的一些注意事项</a>
<a>2.6-案例研究——类似淘宝网品牌列表的效果</a>
<a>2.7-还有其它选择器么？</a>
<a>2.8-小结</a>
</div>
<div class="has_children">
<span>第3章-jQuery中的DOM操作</span>
<a>3.1-DOM操作的分类</a>
<a>3.2-jQuery中的DOM操作</a>
<a>3.3-案例研究——某网站超链接和图片提示效果</a>
<a>3.4-小结</a>
</div>
</div>
</body>
</html>
分享到：
相关推荐
在Android应用开发中，底部导航栏（Bottom Navigation）是一种常见的用户界面元素，它允许用户在应用的几个顶级操作之间快速切换。本项目标题为“Node.js-一行代码实现android底部导航栏”，但实际上，Node.js是...
2. **链式操作**：jQuery支持链式调用，如$("#nav").addClass("active").show()，代码更简洁。 3. **AJAX**：jQuery封装了异步请求，可以轻松实现与服务器的通信，比如动态加载导航内容。 4. **动画**：jQuery的...
星星散射导航栏是一个基于jQuery的插件，主要用于创建具有独特视觉效果的导航栏。这个插件通过在页面上动态生成星形元素，为传统的导航菜单添加了动态散射的效果，使得用户界面更加吸引人。从提供的信息来看，压缩包...
综上所述，"Android—Retrofit+RxJava＋OkHttp与MVP框架结合使用并且附带底部导航栏切换动态效果"这个主题涵盖了Android应用开发中的关键技术和实践。理解并熟练运用这些技术，能够帮助开发者构建出功能强大、性能...
1. **布局**：通过使用Flexbox或Grid布局，可以创建灵活的导航栏结构，确保菜单项在不同屏幕尺寸下都能正确对齐。 2. **过渡和动画**：CSS3的`transition`和`animation`属性可以配合JavaScript实现平滑的视觉效果，...
导航栏位于每个屏幕的顶部，提供了返回按钮和其他操作的快捷方式。在Swift中，我们通常在`UINavigationController`中配置`navigationBar`属性，可以自定义其标题、颜色、按钮等。若要在某个视图控制器上显示导航栏，...
本项目"jquery仿苏宁易购导航"旨在利用jQuery技术，实现与苏宁易购网站相似的导航栏功能，为用户提供直观且易于互动的网页顶部导航体验。 首先，让我们深入了解一下jQuery如何帮助我们创建动态导航。jQuery的核心...
jQuery实现鼠标点击导航栏展开列表内容是Web开发中常见的交互效果，它通过使用jQuery库来简化DOM操作、事件处理和动画效果的实现。以下是对标题和描述中提到的知识点的详细说明。 ### jQuery库的作用和优势 jQuery...
它的核心特性包括选择器（用于找到HTML元素）、链式操作（一个方法调用可以接着另一个）、以及高效的DOM操作。在这个项目中，jQuery将用于获取页面元素、绑定滚动事件和修改元素样式。 二、页面滚动事件 在jQuery...
4. **链式调用**：jQuery的链式调用特性允许我们在一行代码中执行多个操作，提高代码的可读性和效率。 5. **动画效果**：除了基本的显示和隐藏，jQuery还提供了丰富的动画库，如`.slideUp()`和`.slideDown()`，使...
它允许我们在状态栏下方创建一排可点击的按钮，类似于底部导航栏，但位置更靠上。 4. **TTViewController**：在Three20中，每个屏幕都是一个TTViewController实例。我们可以在对应的TTViewController中设置和更新...
jQuery的设计目标是使得JavaScript编程更加简单，通过链式操作、函数式编程、元素选择等特性，极大地提高了开发效率。 二、浮动导航栏（Fixed Navigation Bar） 浮动导航栏是一种始终保持在屏幕顶部或底部的导航...
jQuery的核心特性包括选择器（用于选取DOM元素）、链式操作（一个方法调用后可直接调用另一个方法）和高效动画。在"Tab.html"中，很可能使用了jQuery实现了一个动态切换的选项卡效果，使得用户可以方便地在多个内容...
《jQuery巧克力色二级导航》是一个基于前端技术实现的网页导航栏设计示例，它结合了CSS、HTML5和JavaScript，特别是jQuery库，为网站提供了一种具有吸引力的交互式导航体验。这个压缩包包含了实现这一功能所需的所有...
这种方式通常用于主导航栏，使菜单项更加醒目，吸引用户的注意力。 jQuery是一个轻量级、高性能的JavaScript库，提供了丰富的API供开发者使用。在这个特定的案例中，主要涉及到的知识点包括： 1. **jQuery选择器**...
使用jQuery的链式操作和缓存机制可以提高代码效率，同时合理的组织结构能帮助开发者更好地维护和扩展代码。 8. **使用帮助**：提供的"使用帮助.txt"文件应该包含了如何将这个特效集成到自己的项目中的详细步骤，...
在JavaScript中，jQuery通过选择器（如`$("#id")`、`$(".class")`或`$("tag")`）选取DOM元素，然后可以使用链式方法（如`.click()`、`.hover()`、`.fadeIn()`和`.fadeOut()`）来操作这些元素。在这个特效中，`$....
【标题】：“绝对媲美Flash的Jquery导航条”揭示了使用jQuery库创建的动态、交互式的网页导航栏。在Web开发中，导航条是页面布局的重要组成部分，它帮助用户轻松地浏览网站的不同部分。传统的Flash技术曾因其动画...
在网页设计中，导航栏是不可或缺的部分，它帮助用户快速找到网站的主要内容和功能。而jQuery作为一款强大的JavaScript库，提供了丰富的功能来实现交互式的二级下拉菜单导航。本资源"jquery二级下拉菜单导航代码11...