Getting Bootstrap Carousel to set Active class? I have a Drupal 7 site that has 2 Bootstrap carousels.

One that rotates automatically and takes up the width of the page.
One that has 3 smaller items and only when the page is narrowed (e.g. on mobile device) does it need to rotate.

The first carousel works fine.
The second carousel does rotate until I manually add the &quot;Active&quot; to the class.  Once I do it then begins to auto-rotate between the items.
&lt;div id=&quot;carousel-posts&quot; class=&quot;carousel slide carousel-posts&quot; data-ride=&quot;carousel&quot;&gt;
  &lt;!-- Carousel items --&gt;
  &lt;div class=&quot;carousel-inner&quot;&gt;
    &lt;div class=&quot;item &quot;&gt;...&lt;/div&gt;
    &lt;div class=&quot;item &quot;&gt;...&lt;/div&gt;
    &lt;div class=&quot;item active&quot;&gt;...&lt;/div&gt;
    &lt;div class=&quot;item &quot;&gt;...&lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;

I am trying to figure out how to set one of the items as &quot; active&quot; when the page loads so that if the page is on mobile or resized to small enough it begins to auto-rotate.
I use nodequeue to order the items and bootstrap view to lay them out.
Thank you for any direction you can point me to.
Looks like a bug occurs on this line for the 2nd Carousel where $key never equals $first_key – No Sssweat

That's exactly the answer!
  &lt;!-- Carousel items --&gt;
  &lt;div class=&quot;carousel-inner&quot; role=&quot;listbox&quot;&gt;
    &lt;?php foreach ($rows as $key =&gt; $row): ?&gt;
      &lt;div class=&quot;item &lt;?php if ($key == $first_key) {print 'active';
     } ?&gt;&quot;&gt;
        &lt;?php print $row ?&gt;
      &lt;/div&gt;
    &lt;?php endforeach ?&gt;
  &lt;/div&gt;

Whoever set up the site or theme commented out the part about printing &quot;active&quot; in the  class list.  Probably so it wouldn't auto-rotate, but unfortunately it also made it become hidden when the screen is made narrow.