CODEWITHSUNDEEP
magentotwitter-bootstrap
Malcolm Knott
Malcolm Knott

Reputation: 111

Bootstrap 3 carousel not working on Magento

Can't get this carousel to work on a Magento site. I have one image displaying ok, just the transition between images not happening.

Example that im working on here - http://dev.clothesforsale.co.nz/

Code below:

<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>
    </ol>

    <!-- Wrapper for slides  -->
    <div class="carousel-inner">
        <div class="item active">
            <img src="<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_MEDIA);?>slider/example-banner-one.jpg" alt="Slider One" class="img-responsive"/>
        </div>
    </div>

    <div class="carousel-inner">
        <div class="item">
            <img src="<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_MEDIA);?>slider/example-banner-two.jpg" alt="Slider Two" class="img-responsive"/>
        </div>
    </div>

    <!-- Controls -->
    <a class="left carousel-control" href="#myCarousel" data-slide="prev">
        <span class="glyphicon glyphicon-chevron-left"></span>
    </a>
    <a class="right carousel-control" href="#myCarousel" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right"></span>
    </a>
</div>

<script type="text/javascript">
// <![CDATA[
    $(function(){
       $('.carousel').carousel();
    });
// ]]>
</script>

Upvotes: 1

Views: 1153

Answers (1)

Mike Niland
Mike Niland

Reputation: 11

At first glance, the console shows Object #<Object> has no method 'on' when the page loads, originating on line 163 of bootstrap.js. If I jQuery.fn.jquery in the console to get the jQuery version, it says 1.4.2.

This answer suggests that the on method (which Bootstrap appears to be using) wasn't added until jQuery 1.7. An upgrade might be the first step.

Upvotes: 1

Related Questions