jQuery写fadeTo示例代码_jquery_--HTML5中文学习网

jQuery写fadeTo示例代码_jquery_

2014-02-22 16:01:21 [小大] 已经帮助：人解决问题

复制代码代码如下:

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

（责任编辑：）