썸네일 페이징을 사용하는 Jquery Cycle 플러그인

jQuery주기 플러그인을 CMS에서 작동시키고 (따라서 지저분한 마크 업) 페이지 썸네일을 제외한 모든 작업을 수행하려고합니다. CMS 때문에 축소판의 URL을 해당 이미지의 클래스에 넣어야합니다. 그런 다음 해당 URL을 가져 와서 페이징 단추의 이미지에 사용하려고합니다. 페이징 래퍼가 빌드되고 있지만 각 페이징 단추는 비어 있습니다. 내가 뭘 잘못하고 있는지 모르겠다.썸네일 페이징을 사용하는 Jquery Cycle 플러그인

같은 페이지에 여러 개의 슬라이드 슬라이드 쇼가 있습니다. 여기

(function ($) { 
    $('.gallery').each(function (i) { 
     $(this).after('<div class="galleryNav galleryNav' + i + '">').cycle({ 
      fx: 'scrollHorz', 
      speed: 'fast', 
      timeout: 0, 
      pager: '.galleryNav' + i, 
      pagerAnchorBuilder: function (idx, slide) { 
      var slideImg = $(slide).attr('class'); 

      if (slideImg == undefined){ 
      slideImg = ""; 
      }; 
      return '<div><a href="#" style="background-image:url(' + slideImg + ');"></a></div>'; 
      } 
     }); 
    }); 
})(jQuery);

내 HTML입니다 : 도움을

<div class="row"> 
<article class="galleryArticle"> 
     <div class="galleryWrap"> 
      <div class="gallery"> 
       <img src="image1.jpg" class="image1Thumb.jpg" alt="image1" /> 
       <img src="image2.jpg" class="image2Thumb.jpg" alt="image1" /> 
       <img src="image3.jpg" class="image3Thumb.jpg" alt="image1" /> 
       <img src="image4.jpg" class="image4Thumb.jpg" alt="image1" /> 
      </div> 
     </div> 
     <header> 
      <h1 class="articleTitle">Title</h1> 
      <h2 class="eventDate">Date</h2> 
     </header> 
     <div class="articleContent">Article Content</div> 
</article>

덕분에

여기 내 자바 스크립트입니다. 당신이 img 태그에 주어진

출처

2012-07-09 eCamK

클래스 이름은

클래스 이름이 시작되어야 유효하지 않습니다. 그리고 다음에 이름하지만

<img src="image1.jpg" class="image1Thumb" alt="image1" />

가 작동합니다 당신의 HTML에 STLE 시트

.image1Thump { your styles goes here }

이

처럼 사용

image1Thumb.jpg its invalid

대로 이름을 준 .

출처

2012-07-17 10:21:55 krish

썸네일 페이징을 사용하는 Jquery Cycle 플러그인

답변

관련 문제