img replacement with JQuery

Question

저는 Jquery와 심지어 Javascript를 처음 사용합니다. 시기 적절하게 이미지를 대체하는이 스크립트를 찾아 구현했습니다. 스크립트는 태그에 이미지를 래핑 할 때 잘 작동합니다. 이미지를 링크로 연결하고 싶습니다. 스크립트 sill이 너무 많은 초마다 새로 고칩니다 태그에 태그를 포장하자마자 다음 이미지를로드하지 않습니다. 나는이 스크립트에서 변경해야합니까

가 제대로

<script type='text/javascript'> 
    function swapImages(){ 
     var $active = $('#rooster .active'); 
     var $next = ($('#rooster .active').next().length > 0) ? $('#rooster .active').next() : $('#rooster img:first'); 
     $active.fadeOut(function(){ 
     $active.removeClass('active'); 
     $next.fadeIn().addClass('active'); 
     }); 
    } 

    $(document).ready(function(){ 
     // Run our swapImages() function every 5secs 
     setInterval('swapImages()', 5000); 
    }); </script> 

Answer 1

문제는 여기에 다음 이미지로드를 가지고 :

$('#rooster img:first') 

첫 번째 <img>를 찾아서 페이드하려고하지만, 태그가 잘 붙지 않았기 때문에이 태그 유형을 변경해야합니다.

$('#rooster a:first') 

전반적으로 당신이 그것을 피할 수 있다면이 같은 대신 함수 이름을 통과 setInterval()에 문자열을 전달해서는 안 예를 들어 좀 더 변화는, 비록이 있습니다 :

setInterval(swapImages, 5000); 

이렇게하면 돈을 '이 t 당신은 전반적으로이 같은 것을 할 수있는, 당신의 document.ready에서 그것을 정돈 수, 글로벌 하나로 기능을 떠날 필요가 : 난 당신이 HTML 소스 코드를 게시 할 필요가 있다고 생각

$(function(){ 
    function swapImages(){ 
    var $active = $('#rooster .active'); 
    var $next = $active.next().length > 0 ? $active.next() : $('#rooster a:first'); 
    $active.fadeOut(function(){ 
     $active.removeClass('active'); 
     $next.fadeIn().addClass('active'); 
    }); 
    } 
    setInterval(swapImages, 5000); 
});