Bootstrap carousel with carrierwave

Question

Я пытаюсь сделать слайд-шоу с использованием нескольких фотографий, которые пользователи загружают через несущую.

Это мой пост/show.html.erb

<div id = "carousel-example-generic" class= "carousel slide" data-ride= "carousel"> 
    <!-- Wrapper for slides --> 
    <div class="carousel-inner"> 
    <% @photo_attachments.each do |p| %> 
    <div class="item active"> 
     <%=image_tag p.avatar_url.to_s%> 
    </div> 

    <!-- Controls --> 
    <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev"> 
    <span class="glyphicon glyphicon-chevron-left"></span> 
    </a> 
    <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next"> 
    <span class="glyphicon glyphicon-chevron-right"></span> 
    </a> 
    <% end %> 
</div> 
..... 
<script type="text/javascript"> 
    $(function(){ 
    $('.carousel').carousel(); 
    }); 
    </script> 

Я не могу понять это путь к списку одной фотографии на слайде :(Это еще перечисляя все фотографии, которые я должен прокручивать :(

Answer 1

вы подаете активный класс для всех фотографий, которые вы используете

div class="item active" 

, но это должно быть

div class="item" 

и добавить в свой JavaScript

$('.item:first').addClass('active');