pageAnchorBuilder 질문 - Cycle Plugin - JQuery : 이미지 버튼 변경

Question

jQuery의 Cycle 플러그인을 사용하여 pauseOnHover 기능으로 배너 회전기를 만듭니다. 제대로 작동하고 pageAnchorBuilder 제대로 작동하도록 이미지를 대 '1,2,3, 등등 표시합니다. 문제는 이미지를 찾을 수없는 선택기하지만 divs로 이미지를 사용하고 있기 때문에.

각 슬라이드 (div)에 표시 할 고유 이미지를 지정하도록 다음 코드를 어떻게 변경합니까? img src 태그에 이미지 URL (../images/tab.png)을 배치하면 깨진 링크가 표시됩니다. 그게 작동하려고해도, 내가하려는 일을 성취하지 못할 것이고, div 당 고유 한 이미지를 표시하십시오. 나는 이런 식으로 뭔가의 자바 스크립트 버전을 만들려고하고

: 여기 http://www.bazaarvoice.com

내 코드입니다 : 나는 당신의 잘못된 생각을 가지고 생각

banner.js

$(document).ready(function() { 
    $('.slideshow').cycle({ 
     speed:  200, 
     timeout: 15000, 
     pager:  '#tabs', 
     pagerEvent: 'mouseover', 
     pauseOnPagerHover: true, 
     pagerAnchorBuilder: function(i, slide){// callback fn for building anchor links: function(index, DOMelement) 
    return '<a href="path-to-link"><img src="' + slide.src + '" height="47" width="189" /></a>'; 
} 


    }); 
}); 

Answer 1

무엇 pagerAnchorBuilder 함수는 실제로입니다. 이미 DOM에 요소가 있고 해당 요소에 대해 JQUERY SELECTOR을 반환해야합니다. 각 요소는 각 슬라이드에 해당합니다 (일반적으로 함수에 전달 된 인덱스에 따라 다름). demos here 중 하나를 봅니다. 그것은 당신이 무슨 일이 일어나고 있는지 더 잘 이해할 수 있도록 도울 것입니다.

<div class="slideshow"> 
    <a href="path-to-link1"><img src="/images/src1.png" height="47" width="189" /></a> 
    <a href="path-to-link2"><img src="/images/src2.png" height="47" width="189" /></a> 
</div> 

와주기 플러그인 할 것입니다 : 당신이 앵커를 통해 스크롤주기를 구축을 위해 노력하는 경우

, 당신은 (아마도) div.slidehow는 내부 앵커 HTML 마크 업을 포함하는보다 아무것도 더 많은 일을해야합니다 너를 위해서. 이 플러그인에는 limitations to using images inside anchors이 있습니다.