Bootstrap Carousel Loading, Not Scrolling

I'm setting up a Bootstrap Carousel working from a Django-powered image database. I have no errors in the console log, jQuery is loading, etc., so I'm definitely missing something painfully obvious. It does not transition to other slides, and the controls are not working either. I have tried loading the carousel library separately, and nothing seems to work. I'm using jQuery 1.11.0 loaded via CDN from Google.

ETA:

I am loading bootstrap.min.js after jQuery. I normally have some custom JS running, but I've removed that script for testing.

Here's the Django code generating the carousel:

<div id="mycarousel" class="carousel slide" data-interval="7000" data-ride="carousel">
    <ol class="carousel-indicators">
        {% for image in index_carousel %}
            {% if forloop.first %}
                <li data-target='#mycarousel' class='active' data-slide-to='{{ forloop.counter }}'></li>
            {% else %}  
                <li data-target='#mycarousel' data-slide-to='{{ forloop.counter }}'></li>
            {% endif %} 
        {% endfor %}
    </ol>
    <div class="carousel-inner">
        {% for image in index_carousel %}
            {% if forloop.first %}
                <div class="item active">
            {% else %}
                <div class="item">
            {% endif %}
            <img class="img-responsive" src="{{ image.carousel_image.url }}" alt="Carousel Slide - {{ image.alt_text }}">
            </div>
        {% endfor %}
    </div>
    <!-- Controls -->
    <a class="left carousel-control" href="#mycarousel" role="button" data-slide="prev">
        <span class="glyphicon glyphicon-chevron-left"></span>
    </a>
    <a class="right carousel-control" href="#mycarousel" role="button" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right"></span>
    </a>
</div> <!-- Carousel -->

Here's the generated HTML:

<div id="mycarousel" class="carousel slide" data-interval="7000" data-ride="carousel">
    <ol class="carousel-indicators">
        <li data-target='#mycarousel' class='active' data-slide-to='1'></li>
        <li data-target='#mycarousel' data-slide-to='2'></li>
        <li data-target='#mycarousel' data-slide-to='3'></li>
    </ol>
    <div class="carousel-inner">
        <div class="item active">
            <img class="img-responsive" src="/media/carousel_images/staff_blogs.png" alt="Carousel Slide - ">
        </div>
        <div class="item">
            <img class="img-responsive" src="/media/carousel_images/aarp-tax-help-slide_ZznUFS2.png" alt="Carousel Slide - ">
        </div>
        <div class="item">
            <img class="img-responsive" src="/media/carousel_images/august_book_sale_new.png" alt="Carousel Slide - ">
        </div>
    </div>
    <!-- Controls -->
    <a class="left carousel-control" href="#mycarousel" role="button" data-slide="prev">
        <span class="glyphicon glyphicon-chevron-left"></span>
    </a>
    <a class="right carousel-control" href="#mycarousel" role="button" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right"></span>
    </a>
</div> <!-- Carousel -->

Edit, 13:40UTC:

I removed the "data-ride" and "data-interval" attributes and tried loading the carousel manually with:

<script>
    $(document).ready(function() {
        $('#mycarousel').carousel();
    })
</script>

I placed this at the bottom of the page, after the jQuery and bootstrap.min.js were loaded. Still no console errors, and still no functionality.

EDIT 13:55UTC:

Checked my bootstrap.min.js to make sure it wasn't corrupted and contained the carousel function.

via Chebli Mohamed