2013-12-14 3 views
0

WordPress 3.7을 실행하는 부트 스트랩 캐 러셀 플러그인을 초기화하는 데 문제가 있습니다. 루프를 사용하여 요소를 동적으로로드하려고하지만, 무엇이 잘못되었는지를 확신하지 못합니다. 내가 이해하는 한, 데이터 속성을 정확히 documentation에서 사용하고 있습니다. 코드는 다음과 같습니다.부트 스트랩 캐 러셀 마크 업 오류?

<div id="featured-things" class="carousel slide" data-ride="carousel" > 
    <!-- Indicators --> 
    <ol class="carousel-indicators"> 
    <?php foreach ($slider_things as $key => $thing): ?> 
     <li data-target="#featured-things" <?php 
     if($key==0){print "class='active'";} 
     ?> data-slide-to="<?php print $key?>" ></li> 
    <?php endforeach ?> 
    </ol> 

    <?php foreach ($slider_things as $key => $thing): ?> 
    <div class="carousel-inner"> 
     <div class="item <?php 
     if($key==0){print "active";}?>" > 
     <a href="<?php print $thing->url; ?>"><img src="<?=$thing->feature_image ?>" alt="<?php print $thing->title; ?>" /></a> 
     <div class="carousel-caption"> 
      <p><?php print $thing->caption; ?></p> 
     </div> 
     </div> 
    </div> 
    <?php endforeach ?> 
    <a class="left carousel-control" href="#featured-things" data-slide="prev"> 
    <span class="icon-prev"></span> 
    </a> 
    <a class="right carousel-control" href="#featured-things" data-slide="next"> 
    <span class="icon-next"></span> 
    </a> 
</div> 

jQuery가 머리글에로드되어 bootstrap.min.js가 바닥 글에로드됩니다. JS를 사용하여 초기화하지 않기 때문에 이해할 수 있으므로 필요하지 않습니다.

결과로 슬라이드 쇼가 표시되지만 앞으로 나아 가지 않습니다.

무엇이 누락 되었습니까?

답변

0

모두 정렬 됨. .carousel-inner 요소 내부에 루프를 중첩시켜야한다는 것을 알았습니다.

<div class="carousel-inner"> 
    <?php foreach ($slider_things as $key => $thing): ?> 
     <div class="item <?php if($key==0){print "active";}?>" > 
      <a href="<?php print $thing->url; ?>"> 
      <img src="<?=$thing->feature_image ?>" alt="<?php print $thing->title; ?>" /> 
      </a> 
      <div class="carousel-caption"> 
      <p><?php print $thing->caption; ?></p> 
      </div> 
     </div> 
    <?php endforeach ?> 
</div> 

를 완료
관련 문제