jQuery写fadeTo示例代码


Posted in Javascript onFebruary 21, 2014
<title></title> 
<style type="text/css"> 
.imgclass{ width:300px; height:300px; border:solid 1px red;} 
</style> 
<script src="jquery-1.9.1.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(function () { 
$('#Button1').bind('click', function () { 
$('img').fadeOut(2000, function () { 
$('#Button1').val('哎,没了'); 
}); 
}) 
$('#Button2').bind('click', function () { 
$('img').fadeIn(2000, function () { 
$('#Button2').val('有了'); 
}); 
}) 
$('#Button3').bind('click', function () { 
$('img').fadeTo(2000, 0.3, function () { 
alert('动画执行完毕'); 
}); 
}) 
}) 
</script> 
</head> 
<body> 
<div> 
<div> 
<input id="Button1" type="button" value="淡出" /><input id="Button2" type="button" value="淡入" /><input id="Button3" type="button" value="指定透明度" /></div> 
<div><img src="images/1.jpg" class="imgclass"/></div> 
</div> 
</body>
Javascript 相关文章推荐
jquery将一个表单序列化为一个对象的方法
Jan 03 Javascript
简单的jquery左侧导航栏和页面选中效果
Aug 21 Javascript
jQuery设置Cookie及删除Cookie实例分析
Apr 15 Javascript
浅析Bootstrap组件之面板组件
May 04 Javascript
jquery实现图片上传前本地预览功能
May 10 Javascript
详解vue父子模版嵌套案例
Mar 04 Javascript
在vue中获取dom元素内容的方法
Jul 10 Javascript
jquery实现点击a链接,跳转之后,该a链接处显示背景色的方法
Jan 18 jQuery
微信小程序如何像vue一样在动态绑定类名
Apr 17 Javascript
laydate如何根据开始时间或者结束时间限制范围
Nov 15 Javascript
vue路由守卫,限制前端页面访问权限的例子
Nov 11 Javascript
ElementUI Tree 树形控件的使用并给节点添加图标
Feb 27 Javascript
iframe父页面获取子页面参数的方法
Feb 21 #Javascript
表单序列化与jq中的serialize使用示例
Feb 21 #Javascript
常规表格多表头查询示例
Feb 21 #Javascript
Javascript中引用示例介绍
Feb 21 #Javascript
jquery解析XML字符串和XML文件的方法说明
Feb 21 #Javascript
js 删除数组的几种方法小结
Feb 21 #Javascript
jquery制作居中遮罩层效果分享
Feb 21 #Javascript
You might like
php htmlentities和htmlspecialchars 的区别
2008/08/18 PHP
WordPress开发中自定义菜单的相关PHP函数使用简介
2016/01/05 PHP
php 读取输出其他文件的实现方法
2016/07/26 PHP
解决laravel5.4下的group by报错的问题
2019/10/16 PHP
用javascript获取当页面上鼠标光标位置和触发事件的对象的代码
2009/12/09 Javascript
html+javascript实现可拖动可提交的弹出层对话框效果
2013/08/05 Javascript
JS运动基础框架实例分析
2015/03/03 Javascript
Javascript 是你的高阶函数(高级应用)
2015/06/15 Javascript
jQuery实现仿QQ空间装扮预览图片的鼠标提示效果代码
2015/10/30 Javascript
jQuery插件开发汇总
2016/05/15 Javascript
浅谈javascript中的数据类型转换
2016/12/27 Javascript
React简单介绍
2017/05/24 Javascript
JS+CSS实现滚动数字时钟效果
2017/12/25 Javascript
基于substring()和substr()的使用以及区别(实例讲解)
2017/12/28 Javascript
Vue+webpack项目配置便于维护的目录结构教程详解
2018/10/14 Javascript
js中对象和面向对象与Json介绍
2019/01/21 Javascript
详解vue-cli中使用rem,vue自适应
2019/05/06 Javascript
图文详解WinPE下安装Python
2016/05/17 Python
Django的分页器实例(paginator)
2017/12/01 Python
Python cookbook(数据结构与算法)筛选及提取序列中元素的方法
2018/03/19 Python
Python图像处理实现两幅图像合成一幅图像的方法【测试可用】
2019/01/04 Python
Python3实现的判断环形链表算法示例
2019/03/07 Python
Python将列表数据写入文件(txt, csv,excel)
2019/04/03 Python
python利用wx实现界面按钮和按钮监听和字体改变的方法
2019/07/17 Python
网页切图的CSS和布局经验与要点
2015/04/09 HTML / CSS
新大陆软件面试题
2016/11/24 面试题
高中毕业生的个人自我评价
2014/02/21 职场文书
银行青年文明号事迹材料
2014/05/31 职场文书
中学生秋季运动会广播稿
2014/09/21 职场文书
大学生暑期社会实践证明范本
2014/10/24 职场文书
小学少先队辅导员述职报告
2015/01/10 职场文书
父亲节寄语大全
2015/02/27 职场文书
2015毕业生自我评价范文
2015/03/02 职场文书
2015年学校教务处工作总结
2015/05/11 职场文书
Golang 正则匹配效率详解
2021/04/25 Golang
Java集成swagger文档组件
2021/06/28 Java/Android