展会信息港展会大全

jQuery写fadeTo示例代码
来源:互联网   发布日期:2016-01-28 12:57:28   浏览:2719次  

导读:这篇文章主要介绍了使用jQuery写的fadeTo,需要的朋友可以参考下代码如下:title titlestyle type=text css imgclass{ width:300px; height:300px; border:solid 1px red;} stylescript src=jq ...

这篇文章主要介绍了使用jQuery写的fadeTo,需要的朋友可以参考下

代码如下:

<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>

赞助本站

人工智能实验室

相关热词: fadeTo jQuery

相关内容
AiLab云推荐
展开

热门栏目HotCates

Copyright © 2010-2024 AiLab Team. 人工智能实验室 版权所有    关于我们 | 联系我们 | 广告服务 | 公司动态 | 免责声明 | 隐私条款 | 工作机会 | 展会港