Javascript Javascript淡入淡出图像
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3942727/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Javascript fade image in and out
提问by Piers
I am fairly new to JavaScript and i need a very simple script to fade an image in and out slowly on a loop. Any help would be much appreciated.
我对 JavaScript 相当陌生,我需要一个非常简单的脚本来在循环中缓慢地淡入淡出图像。任何帮助将非常感激。
回答by jantimon
The easiest way would be using jQuery:
最简单的方法是使用 jQuery:
<img src="..." id="myImage">
<script type="text/javascript">
jQuery(function(){
// Fade In
$("#myImage").fadeIn();
// Fade Out
$("#myImage").fadeOut();
});
</script>
Documentation: http://api.jquery.com/fadeIn/
文档:http: //api.jquery.com/fadeIn/
You can also change the fade duration by passing a parameter
您还可以通过传递参数来更改淡入淡出持续时间
// predefined slow (200ms)
$("#myImage").fadeOut("slow");
// predefined fast (600ms)
$("#myImage").fadeOut("fast");
// 1500 ms
$("#myImage").fadeOut(1500);
Update creating a loop:
更新创建循环:
function fadeIn()
{
$(this).fadeIn( fadeOut );
}
function fadeOut()
{
$(this).fadeOut( fadeIn );
}
fadeIn.call($("#myImage"));