Question

I am looking to perform actions after loading the twitter bootstrap carousel. Some event that the carousel triggers when its ready or anything I can tap into.

I am trying to make the carousel goto a particular slide based on query parameters in the URL. Right now my code looks like this:

function getUrlVars() {
var vars = {};
var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
    vars[key] = value;
});
return vars;
}

if (window.location.href.match('\\goto=')) {
    var match =  getUrlVars()['goto'];
    $('.carousel').carousel(match);
}

This will obviously not work until the carousel has loaded and is ready. I don’t want to use delay.

Answer 1

The Carousel plugin has methods to scroll to a particular slide. For example, if your URL is carousel.php?slide=1, then in JavaScript you could have:

<script>
    $('.carousel').carousel();
</script>
<?php if (isset($_GET['slide'])): ?>
<script>
    $('.carousel').carousel(<?php echo intval($_GET['slide']); ?>);
</script>
<?php endif; ?>