CODEWITHSUNDEEP
ruby-on-railstwitter-bootstrap
Bruno
Bruno

Reputation: 6449

Bootstrap Carousel first slide active using render

I'm using render images to show my images. How can I set the first image to be active for Bootstrap Carousel to work? i.e. <div class="item active">

rooms/show.html.erb

<!-- Wrapper for slides -->
<div class="carousel-inner">
    <%= render @images %>
</div>

images/_image.html.erb

<!-- Wrapper for slides -->
<div class="item">
  <%= image_tag image.image.normal.url %>
  <div class="carousel-caption">
    <%= image.name %>
  </div>
</div>

Upvotes: 0

Views: 554

Answers (1)

Mandeep
Mandeep

Reputation: 9173

Try:

<div class="carousel-inner">
  <% @images.each_with_index do |image, index| %>
    <%= render partial: "images/image", locals: {:index => index, :image => image} %>
  <% end %>
</div>

<!-- Wrapper for slides -->
<div class="item <%= 'active' if index == 0 %>">
  <%= image_tag image.image.normal.url %>
  <div class="carousel-caption">
    <%= image.name %>
  </div>
</div>

Upvotes: 3

Related Questions