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


Posted in Javascript onNovember 14, 2013
<!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>无标题文档</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> 
Javascript 相关文章推荐
jQuery学习笔记 操作jQuery对象 CSS处理
Sep 19 Javascript
JS通过ajax动态读取xml文件内容的方法
Mar 24 Javascript
JavaScript实现节点的删除与序号重建实例
Aug 05 Javascript
JS图片放大效果简单实现代码
Sep 08 Javascript
值得分享的Bootstrap Table使用教程
Nov 23 Javascript
AngularJS中的JSONP实例解析
Dec 01 Javascript
webpack4的迁移的使用方法
May 25 Javascript
jQuery中ajax请求后台返回json数据并渲染HTML的方法
Aug 08 jQuery
vue2.0 中使用transition实现动画效果使用心得
Aug 13 Javascript
vue实现类似淘宝商品评价页面星级评价及上传多张图片功能
Oct 29 Javascript
vue使用axios上传文件(FormData)的方法
Apr 14 Javascript
微信小程序如何刷新当前界面的实现方法
Jun 07 Javascript
JQuery实现倒计时按钮具体方法
Nov 14 #Javascript
jquery动态增加删除表格行的小例子
Nov 14 #Javascript
js取消单选按钮选中并判断对象是否为空
Nov 14 #Javascript
Javascript call和apply区别及使用方法
Nov 14 #Javascript
javascript 上下banner替换具体实现
Nov 14 #Javascript
javascript scrollTop正解使用方法
Nov 14 #Javascript
简单的Jquery遮罩层代码实例
Nov 14 #Javascript
You might like
PHP的博客ping服务代码
2012/02/04 PHP
php实现12306火车票余票查询和价格查询(12306火车票查询)
2014/01/14 PHP
PHP5.3以上版本安装ZendOptimizer扩展
2015/03/27 PHP
php 多文件上传的实现实例
2016/10/23 PHP
JavaScript OOP类与继承
2009/11/15 Javascript
ASP.NET jQuery 实例9  通过控件hyperlink实现返回顶部效果
2012/02/03 Javascript
Extjs中通过Tree加载右侧TabPanel具体实现
2013/05/05 Javascript
JavaScript 垃圾回收机制分析
2013/10/10 Javascript
使用jQuery.wechat构建微信WEB应用
2014/10/09 Javascript
JavaScript设计模式之外观模式介绍
2014/12/28 Javascript
jQuery使用$.get()方法从服务器文件载入数据实例
2015/03/25 Javascript
JavaScript小技巧整理
2015/12/30 Javascript
使用postMesssage()实现iframe跨域页面间的信息传递
2016/03/29 Javascript
JS组件Bootstrap dropdown组件扩展hover事件
2016/04/17 Javascript
JS定时检测任务任务完成后执行下一步的解决办法
2016/12/22 Javascript
Vue2.0 从零开始_环境搭建操作步骤
2017/06/14 Javascript
利用Three.js如何实现阴影效果实例代码
2017/09/26 Javascript
Vue header组件开发详解
2018/01/26 Javascript
微信小程序导航栏滑动定位功能示例(实现CSS3的positionsticky效果)
2019/01/24 Javascript
layui问题之自动滚动二级iframe页面到指定位置的方法
2019/09/18 Javascript
es6函数之严格模式用法实例分析
2020/03/17 Javascript
[02:22]2018DOTA2亚洲邀请赛VG赛前采访
2018/04/03 DOTA
[01:32]寻找你心中的那团火 DOTA2 TI9火焰传递活动今日开启
2019/05/16 DOTA
Django 用户登陆访问限制实例 @login_required
2020/05/13 Python
大学生军训自我评价分享
2013/11/09 职场文书
大学新生欢迎词
2014/01/10 职场文书
竞聘副主任科员演讲稿
2014/01/11 职场文书
企业安全生产责任书
2014/04/14 职场文书
小学生学雷锋演讲稿
2014/04/25 职场文书
党员查摆四风问题思想汇报
2014/10/25 职场文书
门卫岗位职责
2015/02/09 职场文书
企业宣传稿范文
2015/07/23 职场文书
担保书格式范文
2015/09/22 职场文书
禁毒心得体会范文
2016/01/15 职场文书
分析设计模式之模板方法Java实现
2021/06/23 Java/Android
浅谈css清除浮动(clearfix和clear)的用法
2023/05/21 HTML / CSS