`
周大帅
  • 浏览: 26511 次
社区版块
存档分类
最新评论

JavaScript强化教程——jQuery 动画2

阅读更多
本文为 H5EDU 机构官方 HTML5培训 教程,主要介绍:JavaScript强化教程 —— jQuery 动画2
实例
jQuery fadeIn()
演示 jQuery fadeIn() 方法。
jQuery fadeOut()
演示 jQuery fadeOut() 方法。
jQuery fadeToggle()
演示 jQuery fadeToggle() 方法。
jQuery fadeTo()
演示 jQuery fadeTo() 方法。
jQuery Fading 方法
通过 jQuery,您可以实现元素的淡入淡出效果。
jQuery 拥有下面四种 fade 方法:
fadeIn()
fadeOut()
fadeToggle()
fadeTo()
jQuery fadeIn() 方法
jQuery fadeIn() 用于淡入已隐藏的元素。
语法:
$(selector).fadeIn(speed,callback);
可选的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。.
可选的 callback 参数是 fading 完成后所执行的函数名称。
下面的例子演示了带有不同参数的 fadeIn() 方法:
实例
$("button").click(function(){
  $("#div1").fadeIn();
  $("#div2").fadeIn("slow");
  $("#div3").fadeIn(3000);
});


jQuery fadeOut() 方法
jQuery fadeOut() 方法用于淡出可见元素。
语法:
$(selector).fadeOut(speed,callback);
可选的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。
可选的 callback 参数是 fading 完成后所执行的函数名称。
下面的例子演示了带有不同参数的 fadeOut() 方法:
实例
$("button").click(function(){
  $("#div1").fadeOut();
  $("#div2").fadeOut("slow");
  $("#div3").fadeOut(3000);
});
分享到:
评论

相关推荐

    浅谈JavaScript库——jQuery,ExtJs的对比研究.pdf

    "浅谈JavaScript库——jQuery,ExtJs的对比研究.pdf" 本文简要介绍了目前流行的JavaScript库,并对其中较为流行的两个库jQuery和ExtJs进行了较详细的介绍和对比研究。本文首先简要介绍了JavaScript库的概念和特点,...

    网页模板——jQuery实现滚动到网站页面底部动画弹出对话框.zip

    这个压缩包文件"网页模板——jQuery实现滚动到网站页面底部动画弹出对话框.zip"很可能是包含了一个示例或模板,用于教导开发者如何利用jQuery来创建这种动态效果。 首先,我们来详细解释一下这个功能的核心知识点:...

    jquery引用文件——jquery.js

    jQuery是由John Resig开发的开源JavaScript库,其主要目标是简化JavaScript的DOM操作,同时提供丰富的事件处理、动画效果和Ajax交互。jQuery的命名源自"JavaScript"和"Quirksmode"的组合,意在解决浏览器之间的兼容...

    浅谈JavaScript 库———jQuery, ExtJs 的对比研究

    ### 浅谈JavaScript库——jQuery与ExtJs的对比研究 #### 一、引言 随着Web 2.0和RIA(Rich Internet Applications)技术的普及,JavaScript作为一种前端开发的重要工具,逐渐占据了重要的地位。它不再仅仅是用于...

    网页模板——jquery左右滑动隐藏图片动画效果相当帅气.zip

    在本资源"网页模板——jquery左右滑动隐藏图片动画效果相当帅气.zip"中,包含了一个利用jQuery实现的动态图片展示方案。 jQuery是一个广泛使用的JavaScript库,它的目标是使JavaScript编程变得更简单、更易于理解和...

    网页模板——jQuery实现点击按钮爆炸式弹出不同颗粒动画特效源码.zip

    总的来说,这个“网页模板——jQuery实现点击按钮爆炸式弹出不同颗粒动画特效源码”是一个学习和实践JavaScript动画技术的好例子。通过研究这个源码,开发者不仅可以掌握jQuery的事件处理和动画制作,还能了解到如何...

    网站导航特效(一)——jQuery

    本教程将探讨“网站导航特效(一)——jQuery”的主题,重点介绍如何利用jQuery库来创建引人注目的导航栏特效。 jQuery是一个广泛使用的JavaScript库,它简化了JavaScript编程,使开发者能够更高效地实现复杂的网页...

    众妙之门——JavaScript与jQuery技术精粹

    《众妙之门——JavaScript与jQuery技术精粹》出自世界知名Web设计网站Smashing Magazine,其中的文章是来自全球顶级设计师的精华总结。全书共分为两大部分,第一部分阐述JavaScript的实战经验,共7章,内容涉及...

    jquery 分页——jqueryPage.js

    jQuery 是一个广泛使用的 JavaScript 库,它简化了 DOM 操作、事件处理和动画效果。`jqueryPage.js` 是一个基于 jQuery 的分页插件,用于帮助开发者轻松实现网页的分页功能。 `jqueryPage.js` 插件的使用首先需要...

    网页模板——jQuery实现按下键盘对应字母亮灯的字母墙动画效果源码.zip

    该压缩包文件“网页模板——jQuery实现按下键盘对应字母亮灯的字母墙动画效果源码.zip”提供了一个基于jQuery的互动网页模板,该模板能够实现一个有趣的字母墙动画效果。当用户在键盘上按下对应的字母时,字母墙上的...

    网页模板——jQuery chili图片远处放大插件打包.zip

    总之,“网页模板——jQuery chili图片远处放大插件打包.zip”提供的是一种提升网页图片展示体验的解决方案,通过使用jQuery Chili插件和精心设计的JavaScript代码,使得用户能够便捷地查看和欣赏网页中的图片。...

    ASP.NET源码——JQuery功能测试源码.zip

    在"ASP.NET源码——JQuery功能测试源码.zip"这个压缩包中,我们很可能会找到一些示例代码,用于展示如何在ASP.NET项目中集成和使用jQuery。 在ASP.NET项目中,jQuery主要被用来增强用户体验,通过AJAX技术实现页面...

    网页模板——jQuery实现生日蛋糕蜡烛动画特效.zip

    首先,jQuery是一个广泛使用的JavaScript库,它简化了DOM操作、事件处理、动画效果和Ajax交互等任务。jQuery的动画功能尤其强大,通过简单的API,开发者可以轻松创建复杂的动画效果。 在这个生日蛋糕蜡烛动画特效中...

    网页模板——jQuery实现的鼠标悬停图片震动特效源码.zip

    总结来说,"网页模板——jQuery实现的鼠标悬停图片震动特效源码"是一个基于jQuery的交互设计案例,通过`mouseenter`、`mouseleave`事件监听和`animate`方法实现动态效果,提供了一种提升用户体验的方式。理解并掌握...

    网页模板——jQuery实现的去哪儿城市选择特效源码.zip

    总的来说,这个"网页模板——jQuery实现的去哪儿城市选择特效源码"是一个综合运用HTML、CSS和jQuery技术的示例,展示了如何利用这些工具创建具有交互性和动态性的网页组件。对于前端开发者来说,学习和理解这个源码...

    疯狂前端开发讲义——jQuery+AngularJS+Bootstrap前端开发实战

    《疯狂前端开发讲义——jQuery+AngularJS+Bootstrap前端开发实战》是一本深入浅出的前端开发教程,它涵盖了三个核心的前端技术:jQuery、AngularJS和Bootstrap。这些技术在现代网页开发中扮演着至关重要的角色,使得...

    PHP实例开发源码——jquery插件之wScratchPad.js.zip

    【标题】"PHP实例开发源码——jquery插件之wScratchPad.js.zip" 提供了一个实际的PHP项目,其中包含了一个基于jQuery的插件——wScratchPad.js。这个插件主要用于创建模拟刮刮卡效果,常用于网页互动设计、游戏或者...

    Ajax框架——jquery树

    jQuery是一个轻量级、高性能的JavaScript库,它简化了HTML文档遍历、事件处理、动画以及Ajax交互。由于其易用性和丰富的插件生态系统,jQuery在Web开发中广泛使用。在构建动态和交互性强的树型结构时,jQuery提供了...

    网页模板——jQuery遮罩点击图片弹出放大预览插件.zip

    综上所述,"网页模板——jQuery遮罩点击图片弹出放大预览插件"是一个利用jQuery和CSS实现的交互功能,它通过遮罩层、弹出框和动态效果,提供了一种优雅的图片预览方式。在网页设计和开发中,掌握这种技术可以提升...

Global site tag (gtag.js) - Google Analytics