基于jquery实现的文字淡入淡出效果
这篇文章介绍了jquery实现的文字淡入淡出效果实例，有需要的朋友可以参考一下
复制代码代码如下:
<!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>无标题文档- www.jbxue.com</title>
<script type="text/javascript" language="javascript" src="../../jquery-1.7.1.min.js">
</script>
<script language="javascript">
$(document).ready(function(){
$("#btn1").toggle(function(){
$("p").fadeOut("slow");
},function(){
$("p").fadeIn("slow");
});
$("#btn2").toggle(function(){
$("p").fadeTo("slow",0.66);
},function(){
$("p").fadeTo("slow",0.66);
});
});
</script>
</head>
<body>
<p style="background:#3F3">this is pi<br>
this is pi<br>
this is pi<br>
this is pi<br>
this is pi<br>
this is pi<br>
</p>
<input type="button" value="淡入/淡出" id="btn1">
</body>
<input type="button" value="淡入/淡出 效果 透明度0.66" id="btn2">
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档- www.jbxue.com</title>
<script type="text/javascript" language="javascript" src="../../jquery-1.7.1.min.js">
</script>
<script language="javascript">
$(document).ready(function(){
$("#btn1").toggle(function(){
$("p").fadeOut("slow");
},function(){
$("p").fadeIn("slow");
});
$("#btn2").toggle(function(){
$("p").fadeTo("slow",0.66);
},function(){
$("p").fadeTo("slow",0.66);
});
});
</script>
</head>
<body>
<p style="background:#3F3">this is pi<br>
this is pi<br>
this is pi<br>
this is pi<br>
this is pi<br>
this is pi<br>
</p>
<input type="button" value="淡入/淡出" id="btn1">
</body>
<input type="button" value="淡入/淡出 效果 透明度0.66" id="btn2">
</html>
基于jquery实现的文字淡入淡出效果的更多相关文章
- Jquery小例子:全选按钮、加事件、挂事件；parent()语法；slideToggle()语法；animate()语法；元素的淡入淡出效果：fadeIn() 、fadeOut()、fadeToggle() 、fadeTo()；function(e):e包括事件源和时间数据;append() 方法
function(e): 事件包括事件源和事件数据,事件源是指是谁触发的这个事件,谁就是事件源(div,按钮,span都可以是事件源),时间数据是指比如点击鼠标的事件中,事件数据就是指点击鼠标的左建或 ...
- 【jQuery】使用JQ来编写面板的淡入淡出效果
本文与上一篇的<[jQuery]使用JQ来编写最主要的淡入淡出效果>(点击打开链接)为姊妹篇. 但上一篇仅仅是对文本的基本控制,本篇则是对面板元素进行控制. 尽管功能上很类似,可是所用到的 ...
- JQuery显示，隐藏和淡入淡出效果
为了把JQuery搞熟悉,看着菜鸟教程,一个一个例子打,边看边记,算是一晚上的一个小总结吧.加油,我很本但是我很勤奋啊.系统的了解它,就要花时间咯. <!DOCTYPE html> < ...
- jQuery-4.动画篇---淡入淡出效果
jQuery中淡出动画fadeOut 让元素在页面不可见,常用的办法就是通过设置样式的display:none.除此之外还可以一些类似的办法可以达到这个目的.这里要提一个透明度的方法,设置元素透明度为 ...
- 【jquery】基于 jquery 实现 ie 浏览器兼容 placeholder 效果
placeholder 是 html5 新增加的属性,主要提供一种提示(hint),用于描述输入域所期待的值.该提示会在输入字段为空时显示,并会在字段获得焦点时消失.placeholder 属性适用于 ...
- Javascript-- jQuery动画篇(淡入淡出效果)
淡入淡出效果 jQuery 提供了下面几种方法可以实现显示的淡入淡出效果: fadeIn() fadeOut() fadeToggle() fadeTo() fadeIn()方法 fadeIn()实现 ...
- 淡入淡出效果的js原生实现
淡入淡出效果,在日常项目中经常用到,可惜原生JS没有类似的方法,而有时小的页面并不值得引入一个jQuery库,所以就自己写了一个,已封装, 有用得着的朋友, 可以直接使用. 代码中另附有一个设置元素透 ...
- 原生JS实现淡入淡出效果(fadeIn/fadeOut/fadeTo)
淡入淡出效果,在日常项目中经常用到,可惜原生JS没有类似的方法,而有时小的页面并不值得引入一个jQuery库,所以就自己写了一个,已封装, 有用得着的朋友, 可以直接使用. 代码中另附有一个设置元素透 ...
- 基于 jQuery 实现垂直滑动的手风琴效果
今天我们要与大家分享一个漂亮而灵活的垂直 jQuery 手风琴效果.其主要思想是扩大手风琴片上的点击和显示更多的信息.其他内容片段将变得不那么透明.当使用一个导航箭头导航下一个片段,新的片会从顶部或底 ...
随机推荐
- Chapter 1 Securing Your Server and Network(6):为SQL Server訪问配置防火墙
原文出处:http://blog.csdn.net/dba_huangzj/article/details/38082123,专题文件夹:http://blog.csdn.net/dba_huangz ...
- ubuntu12.04的vim配置
ubuntu12.04中使用的vim的版本不支持像语法高亮和文件类型检测等配置 #sudo apt-get install vim vim默认的配置使用起来还不能让人满意,还需要自己配置默认配置文件是 ...
- 文件和目录之mkdir和rmdir函数
用mkdir函数创建目录,用rmdir函数删除目录. #include <sys/stat.h> int mkdir( const char *pathname, mode_t mode ...
- NIO学习：buffer读入与写出（文件复制示例）
FileInputStream fInputStream=new FileInputStream(new File("/root/Desktop/testImage.jpg")); ...
- 布隆过滤器（Bloom Filter）
一.布隆过滤器介绍 Bloom Filter是一种空间效率很高的随机数据结构,Bloom Filter可以看做是对bit-map的扩展,它的原理如下: 当一个元素被加入集合时,通过K个Hash函数将这 ...
- Servlet & JSP - Decorating Requests and Responses
Servlet API 提供了四个包装类:ServletRequestWrapper.ServletResponseWrapper.HttpServletRequestWrapper.HttpServ ...
- Unity3D用vistual studio打卡C#脚本卡死解决
小黑已经跟我3年了,不仅很喜欢他方正酷黑的外表,而且稳定性绝对没的说.我已经3年没有重装过系统了,而且现在装了3个系统!虽然小黑很适合程序员,但是他最大的缺点就是做设计比较吃力,显卡512M.像uni ...
- 时间处理总结（一）.net
不断整理中... 获取当前时间DateTime.Now.ToString("d") ;//获取到的日期格式为eg :2013/11/14 时间格式只取年月日DateTime.Now ...
- CentOS 7 安装 Apache PHP MariaDB
准备篇: 一.配置防火墙,开启80端口.3306端口 CentOS 7 默认使用的是firewall作为防火墙,这里改为iptables防火墙. 1.关闭firewall: systemctl sto ...
- swift 泛型
T就是类型,范型