Mi a gond az alábbi bootstrap carousel-lel?

http://confiniumhu.szalaimihaly.hu

$(document).ready(function () {

positionCarousel();

showCarouselLayer(800,1600);

$('#myCarousel').carousel(

{

interval: 3000

}

);

//First

$('#myCarousel').on('slide.bs.carousel', function (event) {

showCarouselLayer(800,1600);

});

//Second

$('#myCarousel').on('slid.bs.carousel', function () {

});

});

var positionCarousel = function () {

var active = $('.carousel-inner').find('.item');

var carouselImg = active.find('img');

var carouselCaption = active.find('.c-caption');

carouselCaption.css('background', 'rgba(0, 0, 0, 0.4)');

carouselCaption.height(carouselImg.height() - 50);

var h2 = carouselCaption.find('h2');

h2.css('margin-top', (carouselCaption.height() / 2) - h2.height());

};

var showCarouselLayer = function (timeoutShow,timeOutHide) {

setTimeout(function () {

var active = $('.carousel-inner').find('.active');

var carouselCaption = active.find('.c-caption');

carouselCaption.fadeIn(500);

setTimeout(function () {

carouselCaption.fadeOut(500);

},timeOutHide);

},timeoutShow);

};

<div id="myCarousel" class="carousel slide">

<!-- Indicators -->

<ol class="carousel-indicators">

<li data-target="#myCarousel" data-slide-to="0" class="active"></li>

<li data-target="#myCarousel" data-slide-to="1"></li>

<li data-target="#myCarousel" data-slide-to="2"></li>

<li data-target="#myCarousel" data-slide-to="3"></li>

<li data-target="#myCarousel" data-slide-to="4"></li>

</ol>

<!-- Wrapper for slides -->

<div class="carousel-inner">

<div class="item active">

<?= $this->Html->image('c1.jpg') ?>

<div class="c-caption">

<h2>Vállalkozásalapítás?</h2>

</div>

</div>

<div class="item">

<?= $this->Html->image('c2.jpg') ?>

<div class="c-caption">

<h2>Vállalkozásfejlesztés?</h2>

</div>

</div>

<div class="item">

<?= $this->Html->image('c3.jpg') ?>

<div class="c-caption">

<h2>Bővülés és terjeszkedés?</h2>

</div>

</div>

<div class="item">

<?= $this->Html->image('c4.jpg') ?>

<div class="c-caption">

<h2>Biztonságos, hatékony működés?</h2>

</div>

</div>

<div class="item">

<?= $this->Html->image('c5.jpg') ?>

<div class="c-caption">

<h2>Állunk rendelkezésére</h2>

</div>

</div>

</div>

<!-- Left and right controls -->

<a class="left carousel-control" href="#myCarousel" data-slide="prev">

<span class="glyphicon glyphicon-chevron-left"></span>

<span class="sr-only">Previous</span>

</a>

<a class="right carousel-control" href="#myCarousel" data-slide="next">

<span class="glyphicon glyphicon-chevron-right"></span>

<span class="sr-only">Next</span>

</a>

</div>

Ha elég gyors a net, és a képek elég gyorsan betöltődnek, akkor nagyon szépen fut. De lassú net mellett nem jelennek meg a szövegek rajta.