<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无档</title>
<script src="jq.js" type="text/javascript"></script>
<script src="js.js" type="text/javascript"></script>
</head>
<style>
#menu{
width:300px;
}
.haschildren{
padding:3px;
background-color:#999;
margin-bottom:11px;
}
div a{
z-index:-11px;
background:#666;
display:none;
float:left;
width:300px;
}
</style>
<body>
<div id="menu">
<div class="haschildren">
<span>第一章</span>
<a>javascript</a>
<a>加入</a>
<a>编写方法</a>
<a>小结</a>
</div>
<div class="haschildren">
<span>第二章</span>
<a>jquery选择器是什么</a>
<a>jquery的优势</a>
<a>jquery选择器</a>
<a>小结</a>
</div>
</div>
</body>
</html>
$(document).ready(function(){
$(".haschildren").hover(function(){
//清空之前的动画并且把动画之前到末状态
$(this).children("a").stop(true,true).slideDown(511).end()
.siblings().children("a").stop(true,true).slideUp(111);
},function(){
$(this).stop(true,true);
$(this).children("a").slideUp(1111);
})
});
http://xinwenmm.co.cc
分享到:
相关推荐
也可以使用`.stop()`来立即停止当前正在执行的动画。 6. **回调函数**:每个动画方法都可以接受一个回调函数作为最后一个参数,当动画完成时执行。这对于链式动画和基于状态的交互非常有用。 7. **自定义动画**:...
合理地使用动画,避免在循环中调用动画方法,以及利用 `stop()` 来中断当前动画,都是优化性能的关键。 7. **动画的缓动效果** 缓动(easing)函数可以改变动画的速度曲线,使动画看起来更加自然。jQuery 自带了...
现在,我们使用jQuery来添加动画效果。jQuery提供了多种动画方法,如`fadeIn()`, `fadeOut()`, `slideToggle()`等。假设我们希望在用户鼠标悬停在菜单项上时,子菜单以滑动效果展开: ```javascript $(document)....
压缩包中的"jquery-drill-down-menu-plugin"可能是一个已经封装好的jQuery下拉菜单插件,使用它可以快速构建动画下拉菜单,减少自定义代码的工作量。通常,这样的插件会提供一些配置选项,如动画速度、方向、触发...
jQuery学习动画效果基础是指使用jQuery库来实现网页中的动画效果,包括显隐动画、滑块动画、淡入淡出动画和自定义动画等。通过掌握这些基本动画效果,可以丰富网页的交互性和视觉效果,提高用户体验。
本文将深入探讨jQuery队列函数的使用以及如何创建动画特效,这对于初学者来说是一份宝贵的教程。 ### 1. jQuery的动画基础 在jQuery中,`animate()`方法是最基本的动画函数,它可以用于改变元素的CSS属性,如宽度...
在前端开发领域,jQuery是一个广泛使用的JavaScript库,它极大地简化了JavaScript操作DOM、处理事件、创建动画等功能。"jQuery动画特效大全"这个压缩包显然包含了大量利用jQuery制作的各种动画效果及其源码,对于...
例如,可以使用`delay()`方法在动画之间添加延迟,使用`stop()`方法停止当前正在运行的动画,或者借助第三方插件如`jQuery.easing`扩展更多缓动函数。 总结一下,通过jQuery的`animate()`方法,我们可以轻松地创建...
本资源"jquery加分动画效果.zip"显然是关于如何使用jQuery来创建动态的分数增加效果,这在游戏或者评分系统中常见。下面我们将详细探讨jQuery动画效果的实现方式以及与CSS的配合。 一、jQuery动画基础 1. `animate...
在本文中,我们将深入探讨如何使用jQuery框架来创建鼠标的图片动画效果。jQuery是一个流行的JavaScript库,它简化了DOM操作、事件处理、动画效果以及AJAX交互,使得开发者能够更高效地构建动态网页。 首先,要实现...
在“jQuery过渡动画打开层窗口特效”中,最常使用的是`fadeIn()`和`slideDown()`,它们分别用于淡入和下拉展开元素,非常适合于创建层窗口的打开效果。 `fadeIn()`方法用于让选定的元素逐渐变得可见,接受一个可选...
如果有一系列连续的动画,且你想跳到最后一个动画的状态,需要在每个动画之间使用`stop(true, true)`来确保动画队列的正确处理。 举个例子,如果我们有以下代码: ```javascript $("div.content") .animate({...
《jQuery实现3D菜单展开动画详解》 在网页设计中,动态效果往往能提升用户体验,增加网站的吸引力。其中,jQuery库因其丰富的功能和简洁的API,成为了实现这些效果的首选工具。本教程将深入探讨如何利用jQuery实现...
JQuery的animate方法是...理解并熟练运用stop方法对于精细控制JQuery动画至关重要,这使得开发者能够创建更复杂、交互性更强的用户界面。在处理多个连续动画或者需要响应用户交互的场景时,stop方法的作用尤为突出。
利用jQuery和HTML5可以模拟很多数学中的函数图象,比如HTML5 Canvas正弦波动画。今天我们要介绍一个用jQuery实现简单的模拟抛物线轨迹的插件,可以开始和暂停抛物线的运动,以及重新设置抛物线的参数。 下面简单...
在这个项目中,我们可能有一个名为`script.js`或类似的文件,它包含了使用jQuery实现动画效果的代码。在JavaScript中,我们使用`$(document).ready()`函数确保在页面加载完成后执行我们的代码。然后,我们可以使用...
本教程将深入讲解如何使用jQuery来创建一个鼠标悬停时的动画效果,具体表现为当鼠标移到图片上方时,小图片会缓缓向上移动并最终静止。 首先,我们需要在HTML文件中引入jQuery库。这可以通过在头部添加CDN链接或者...
接下来,我们来看看如何使用jQuery.spin.js创建自定义的Loading动画: 1. **初始化设置**:在你的JavaScript代码中,通过$.fn.spin方法初始化动画。你可以传入一个预设的spinner选项(如'large'或'small'),或者...
9. jQuery的stop()方法:当多个动画依次执行时,stop()方法可以立即停止当前正在运行的动画,并可以选择清除元素上排队的动画,以便可以快速地切换到其他动画效果。 10. jQuery的toggle()方法:这个方法用于切换...
综上所述,jQuery为开发者提供了强大的动画功能,包括停止动画的stop()方法,方便易用的淡入淡出动画fadeIn()和fadeOut(),以及灵活的自定义动画animate()。这些工具使得创建丰富的用户交互和视觉效果变得更加简单。...