2013-04-08 2 views
0

이 jQuery Cycle2 플러그인 (http://www.malsup.com/jquery/cycle2/api/advanced.php)을 사용하고 있으며 각 슬라이드 내부의 제목을 사용하여 사용자 정의 호출기를 작성하려고했습니다.jQuery Cycle2 API를 통한 고급 호출기

주기 2의 문서는 HTML의 데이터 속성에 더 중점을 둡니다. 그러나 javascript 대안을 통해 cycle2 플러그인을 실행해야합니다.

API를 통해이 buildPagerLink를보고 있었지만 알아낼 수는 없습니다.

$('.p-slider').on('cycle-bootstrap', function(e, optionHash, API) { 
    API.buildPagerLink = function(opts, slideOpts, slide) { 
     //CODE TO GET H2 TITLE 
    } 
}); 

기본적으로 내가 원하는 것은 이것입니다. 각 슬라이드에는 <h2> 요소가 있습니다. 그 안의 텍스트를 호출기의 링크 텍스트로하고 싶습니다. 간단하게 들리지만, 나는 그것을 이해할 수 없다.

도움을 주시면 감사하겠습니다.

감사합니다. Dave

답변

1

buildPagerLink와 함께 이것을 사용하여 문서에 바인딩해야하는 알려진 버그가 있습니다.

$(document).on('cycle-bootstrap', function(e, opts, API) { 
    API.buildPagerLink = function(opts, slideOpts, slide) { 
     var pagerLink; 
    var pagers = opts.API.getComponent('pager'); 
    pagers.each(function() { 
     var pager = $(this); 

      var markup = $('<span></span>').text($('h2', slide).text()); 
      pagerLink = $(markup).appendTo(pager); 
     pagerLink.on(opts.pagerEvent, function(e) { 
      e.preventDefault(); 
      opts.API.page(pager, e.currentTarget); 
     }); 
    }); 
    } 
}); 

$('.slideshow').cycle(); 

근무 데모 : : 참고로 http://jsfiddle.net/lucuma/FetC8/1/

문제 : 도움을 https://github.com/malsup/cycle2/issues/157

+0

감사합니다, 그러나 나는 실제로 API 방법을 필요로 할 다음은 H2 텍스트를 당겨 그것으로 호출기를 구축 할 것 CMS와 관련하여이 문제를 해결했습니다. – davebowker

+0

귀하의 의견을 이해할 수 없습니다. 내가 제공 한 것은 "javascript 대안"을 제공하는 것과 관련이 있습니다. – lucuma