• fadeIn()
  • fadeOut()
  • fadeToggle()
  • fadeTo()

jQuery fadeIn() 用于淡入已隐藏的元素

$("button").click(function(){
$("#div1").fadeIn();
$("#div2").fadeIn("slow");
$("#div3").fadeIn(3000);
}); jQuery fadeOut() 方法用于淡出可见元素。
$("button").click(function(){
$("#div1").fadeOut();
$("#div2").fadeOut("slow");
$("#div3").fadeOut(3000);
}); fadeToggle() 方法可以在 fadeIn() 与 fadeOut() 方法之间进行切换
$("button").click(function(){
$("#div1").fadeToggle();
$("#div2").fadeToggle("slow");
$("#div3").fadeToggle(3000);
}); fadeTo() 方法允许渐变为给定的不透明度(值介于 0 与 1 之间)。
$("button").click(function(){
$("#div1").fadeTo("slow",0.15);
$("#div2").fadeTo("slow",0.4);
$("#div3").fadeTo("slow",0.7);
});
												

jQuery,您可以实现元素的淡入淡出效果。的更多相关文章

  1. Jquery小例子:全选按钮、加事件、挂事件;parent()语法;slideToggle()语法;animate()语法;元素的淡入淡出效果:fadeIn() 、fadeOut()、fadeToggle() 、fadeTo();function(e):e包括事件源和时间数据;append() 方法

    function(e): 事件包括事件源和事件数据,事件源是指是谁触发的这个事件,谁就是事件源(div,按钮,span都可以是事件源),时间数据是指比如点击鼠标的事件中,事件数据就是指点击鼠标的左建或 ...

  2. 【jQuery】使用JQ来编写面板的淡入淡出效果

    本文与上一篇的<[jQuery]使用JQ来编写最主要的淡入淡出效果>(点击打开链接)为姊妹篇. 但上一篇仅仅是对文本的基本控制,本篇则是对面板元素进行控制. 尽管功能上很类似,可是所用到的 ...

  3. JQuery显示,隐藏和淡入淡出效果

    为了把JQuery搞熟悉,看着菜鸟教程,一个一个例子打,边看边记,算是一晚上的一个小总结吧.加油,我很本但是我很勤奋啊.系统的了解它,就要花时间咯. <!DOCTYPE html> < ...

  4. jQuery淡入淡出效果轮播图

    用JavaScript做了平滑切换的焦点轮播图之后,用jQuery写了个简单的淡入淡出的轮播图,代码没有做优化,html结构稍微有一些调整,图片部分用ul替换了之前用的div. html结构如下: & ...

  5. 基于jquery实现的文字淡入淡出效果

    这篇文章介绍了jquery实现的文字淡入淡出效果实例,有需要的朋友可以参考一下 复制代码代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1 ...

  6. jQuery-4.动画篇---淡入淡出效果

    jQuery中淡出动画fadeOut 让元素在页面不可见,常用的办法就是通过设置样式的display:none.除此之外还可以一些类似的办法可以达到这个目的.这里要提一个透明度的方法,设置元素透明度为 ...

  7. Javascript-- jQuery动画篇(淡入淡出效果)

    淡入淡出效果 jQuery 提供了下面几种方法可以实现显示的淡入淡出效果: fadeIn() fadeOut() fadeToggle() fadeTo() fadeIn()方法 fadeIn()实现 ...

  8. 淡入淡出效果的js原生实现

    淡入淡出效果,在日常项目中经常用到,可惜原生JS没有类似的方法,而有时小的页面并不值得引入一个jQuery库,所以就自己写了一个,已封装, 有用得着的朋友, 可以直接使用. 代码中另附有一个设置元素透 ...

  9. 原生JS实现淡入淡出效果(fadeIn/fadeOut/fadeTo)

    淡入淡出效果,在日常项目中经常用到,可惜原生JS没有类似的方法,而有时小的页面并不值得引入一个jQuery库,所以就自己写了一个,已封装, 有用得着的朋友, 可以直接使用. 代码中另附有一个设置元素透 ...

随机推荐

  1. CentOS 7.2 安装Python3.5.2

    系统环境: CentOS 7.2 x86_64 安装相关包 (1)# yum install zlib-devel bzip2-devel openssl-devel ncurses-devel sq ...

  2. Java中==和equals()的区别

  3. workspace 配置

    1.新建workspace 在配置好相关信息前,请勿引入工程代码,避免环境不完整的情况下编译进入长时间等待 2.设置工作窗体结构 建议使用Java模式开发窗体设置 3. 编码 工程全部采用UTF-8编 ...

  4. 邓_ SVN·最新使用教程总结

    SVN简介: 为什么要使用SVN? 程序员在编写程序的过程中,每个程序员都会生成很多不同的版本,这就需要程序员有效的管理代码,在需要的时候可以迅速,准确取出相应的版本. Subversion是什么? ...

  5. python orm框架-----SQLALchemy-查询篇

    似乎ORM最难设计的部分是查询.特别是面向对象的查询,今天学习SQLAlchemy,发现SQLAlchemy的查询语法竟如此灵活,惊叹其如此强大的表达能力的同时也对Python也有了更深的认识.下面看 ...

  6. [bzoj1861][Zjoi2006]Book 书架_非旋转Treap

    Book 书架 bzoj-1861 Zjoi-2006 题目大意:给你一个序列,支持:将指定编号的元素抽出,放到序列顶(底):将指定编号元素左右篡位:查询指定编号元素位置:查询指定数量位置元素编号. ...

  7. 自己定义ShareSDK分享平台界面

    自己定义ShareSDK分享平台界面 执行效果图: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvZ2FvX2NodW4=/font/5a6L5L2T/fo ...

  8. Android传统HTTP请求get----post方式提交数据(包括乱码问题)

    1.模仿登入页面显示(使用传统方式是面向过程的) 使用Apache公司提供的HttpClient  API是面向对象的 (文章底部含有源码的连接,包括了使用async框架) (解决中文乱码的问题.主要 ...

  9. JavaThread等待/通知经典范式

    JavaThread等待/通知经典范式 package com.stono.thread; import java.text.SimpleDateFormat; import java.util.Da ...

  10. uva 10479(找规律+递归)

    题意:有一个初始序列第一个数字是0. 规律是把前一次推出来的每个数字x.先接x个0,然后接x+1. 0 –> 1 –> 02 –> 1003 –> 02110004 那么这个序 ...