방법 fadein 및 페이드 아웃 이미지는 한 번만 JQuery와

에서 이것은 내가 한 번만 연기 애니메이션을 수행하는, 내가 4 개 이미지를 데, 4 개 연기 이미지 fadein해야 원하는 페이드 아웃하지만 내 코드방법 fadein 및 페이드 아웃 이미지는 한 번만 JQuery와

<!DOCTYPE HTML> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<title></title> 
<style> 
#wrap{ 
    position:fixed; 
    z-index:-1; 
    top:0; 
    left:0; 
    background-color:black 
} 
#wrap img.bgfade{ 
    position:absolute; 
    top:0; 
    display:none; 
    width:100%; 
    height:100%; 
    z-index:-1 
} 
</style> 
</head> 

<body> 
<div id="wrap"> 
<img class="bgfade" src="images/s1.png"> 
<img class="bgfade" src="images/s2.png"> 
<img class="bgfade" src="images/s3.png"> 
<img class="bgfade" src="images/s4.png"> 
</div> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script> 
<script type="text/javascript"> 
$(window).load(function(){ 
    $('img.bgfade').hide(); 
    var dg_H = $(window).height(); 
    var dg_W = $(window).width(); 
    $('#wrap').css({'height':dg_H,'width':dg_W}); 
    function anim() { 
     $("#wrap img.bgfade").first().appendTo('#wrap').fadeOut(2000); 
     $("#wrap img").first().fadeIn(1000); 
      setTimeout(anim, 3000); 
          //setInterval(anim, 3000); 
    } 

    anim(); 
}); 
</script> 
</body> 
</html>

입니다 . 네 번째 이미지가 사라질 때마다 애니메이션이 다시 발생하지 않아야합니다. 나는이 사이트에서이 코드를 가져왔다 http://demo.web3designs.com/jquery-animated-background-images-fade-in-out.htm. 친절하게 도와주세요.

출처

2013-09-27 D J

당신이뿐만 아니라 HTML을 공유 할 수 있습니다 시도 –

당신이 무엇을 말하려고하는지 알 수는 없지만 ..로드 기능에서 원하는 경우에만 호출하고 setTimeout을 제거하십시오. 전화를 걸 필요가없는 경우 왜 setTimeout을 사용하고 있는지 잘 모릅니다. 다시).

$(window).load(function(){ 
    $('img.bgfade').hide(); 
    var dg_H = $(window).height(); 
    var dg_W = $(window).width(); 
    $('#wrap').css({'height':dg_H,'width':dg_W}); 

    anim(); 
}); 

function anim() { 
    $("#wrap img.bgfade").first().appendTo('#wrap').fadeOut(1500); 
    $("#wrap img").first().fadeIn(1000); 
}

출처

2013-09-27 07:09:19 bipen

var $imgs = $("#wrap img"); 

function anim() { 
    var $current = $imgs.filter('.current').removeClass('current'), 
     $next = $current.next(); 
    $next = $next.length ? $next : $imgs.first(); 
    $next.addClass('current'); 

    $current.fadeOut(1500); 
    $next.fadeIn(1000); 
    if (!$imgs.last().is($next)) { 
     setTimeout(anim, 3000); 
    } 
} 
anim();

출처

2013-09-27 07:14:00

방법 fadein 및 페이드 아웃 이미지는 한 번만 JQuery와

답변

관련 문제