Embedding a Twitter Bootstrap Carousel Slider in a Wordpress Template

Question

PHP

Good afternoon.
I am making a wordpress site. I use the famous Twitter Bootstrap as a framework. In principle, everything is without surprises, only here is the problem with the slider. The fact is that the standard output of the carousel from bootstrap

<div id="myCarousel" class="carousel slide">
  <!-- Carousel items -->
  <div class="carousel-inner">
    <div class="active item">…</div>
    <div class="item">…</div>
    <div class="item">…</div>
  </div>
  <!-- Carousel nav -->
  <a class="carousel-control left" href="#myCarousel" data-slide="prev">‹</a>
  <a class="carousel-control right" href="#myCarousel" data-slide="next">›</a>
</div>

I replaced in the WordPress template with

<div id="myCarousel" class="carousel slide">
<?php query_posts('showposts=3&cat=5');?>
<div class="carousel-inner">
<?php while (have_posts()) : the_post(); ?>
<div class="item">
<img src="http://placeimg.com/770/340/people" alt="">								
<div class="carousel-caption">									
<p><?php the_time('d.m.Y'); ?></p>									
<h4><?php the_title(); ?></h4>											
</div>										
</div>									
<?php endwhile; ?>									
</div>
<a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">›</a>
</div>

Pay no attention to the picture. I'll put a thumbnail in there later. The problem is different.
So, when the page loads, the slider is not displayed until JS adds the active class to one of the blocks.
Now a question. How to make it so that either php adds this class to the first encountered div or JS substitutes this class to the block immediately after the script fires, and not after the time specified in the script

jQuery(document).ready(function($) {
    $('.carousel').carousel({
  		interval: 8000
  	})
});

I, to my great shame, know practically nothing in either JS or php (compared to most who read this text), so I would be grateful for the most detailed answer.
Thanks

UPD : Solution found. Thank you avalak

Answer 1

If my memory serves me, something like that. Codex

<?php if ($wp_query->current_post == 0) echo('active'); ?>

<?= $wp_query->current_post == 0 ? 'active' : '' ?>

Add here:

<div class="item <?php if ($wp_query->current_post == 0) echo('active'); ?>">...</div>