引导旋转木马内谷歌地图信息框

我在我的网站上使用Bootstrap，我使用谷歌地图api v3 (javascript)创建了一个带有多个标记的地图。我想在每个标记的信息窗口有一个图像旋转木马。为了能够控制信息窗口的样式，我使用了Infobox插件。

问题是carousel不能在Infobox中工作。请查看这个演示:

http://liveweave.com/MourQl

你能帮我修这个吗?JQuery和Infobox之间是否存在某种不兼容?

下面是创建地图的js代码:

<script type="text/javascript">
    function initialize() {
        var locations = [
          ['<h4>Bondi Beach</h4>', -33.890542, 151.274856],
          ['<h4>Maroubra Beach</h4>', -33.950198, 151.259302]
        ];
        var content = [
          ['<div id="carousel-example-1" class="carousel slide" data-ride="carousel" data-interval="false"><div class="carousel-inner"><div class="item active"><img src="http://i60.tinypic.com/25g70g9.jpg" alt=""></div><div class="item"><img src="http://i57.tinypic.com/ddgoia.jpg" alt="..."></div><div class="item"><img src="http://i58.tinypic.com/b3ws5c.jpg" alt="..."></div></div><a class="prev carousel-control" href="#carousel-example-1" role="button" data-slide="prev"></a><a class="next carousel-control" href="#carousel-example-1" role="button" data-slide="next"></a></div>'],
          ['<div id="carousel-example-2" class="carousel slide" data-ride="carousel" data-interval="false"><div class="carousel-inner"><div class="item active"><img src="http://i60.tinypic.com/25g70g9.jpg" alt=""></div><div class="item"><img src="http://i57.tinypic.com/ddgoia.jpg" alt="..."></div><div class="item"><img src="http://i58.tinypic.com/b3ws5c.jpg" alt="..."></div></div><a class="prev carousel-control" href="#carousel-example-2" role="button" data-slide="prev"></a><a class="next carousel-control" href="#carousel-example-2" role="button" data-slide="next"></a></div>']
        ];
        var map = new google.maps.Map(document.getElementById('map-container'), {
          zoom: 10,
          center: new google.maps.LatLng(-37.92, 151.25),
          mapTypeId: google.maps.MapTypeId.ROADMAP,
          mapTypeControl: false,
          streetViewControl: false,
          panControl: false,
          zoomControlOptions: {
             position: google.maps.ControlPosition.LEFT_BOTTOM
          }
        });
        var markers = new Array();
        //var iconCounter = 0;
        var markerImg = 'http://i58.tinypic.com/dr9o5j.png';
        var activeMarkerImg = 'http://i58.tinypic.com/w6ph7c.png';

        // Add the markers and infowindows to the map
        for (var i = 0; i < locations.length; i++) {  
         var marker = new google.maps.Marker({
              position: new google.maps.LatLng(locations[i][1], locations[i][2]),
              map: map,
              icon: markerImg
          });
          markers.push(marker);
            var myOptions = {
             content: content[i][0]
            ,disableAutoPan: false
            ,maxWidth: 0
            ,pixelOffset: new google.maps.Size(-125, -250)
            ,zIndex: null
            ,boxStyle: { 
              width: "250px"
             }
            ,closeBoxMargin: "0"
            ,closeBoxURL: ""
            ,infoBoxClearance: new google.maps.Size(1, 1)
            ,isHidden: false
            ,pane: "floatPane"
            ,enableEventPropagation: false
        };
        var ib = new InfoBox(myOptions);

        google.maps.event.addListener(marker, "click", function (e) {
          jQuery('.carousel').carousel();
          ib.open(map, this);
          jQuery('.carousel').carousel();
        });
        google.maps.event.addListener(ib, 'domready', function() {
            jQuery('.carousel').carousel();  
        });
        //ib.open(map, marker);

        }
        google.maps.event.addListener(map, 'click', function() {ib.close();});

        function AutoCenter() {
          //  Create a new viewpoint bound
          var bounds = new google.maps.LatLngBounds();
          //  Go through each...
          $.each(markers, function (index, marker) {
            bounds.extend(marker.position);
          });
          //  Fit these bounds to the map
          map.fitBounds(bounds);
        }
        AutoCenter();
    }
</script>

<script type="text/javascript">
jQuery(window).on('load', function () {
    //map initialize
    initialize();
});
</script>

infoWindow: function(content, map, marker) {
        google.maps.event.addListener(marker, 'click', function() {
            // If there is an open infobox on the screen, close it out
            if (ib) {
                ib.close();
            }
            ib.setContent($('.unitInfoBox').clone().html());
            ib.open(map, marker);
            // Once the infobox is fully loaded, add your events here
            ib.addListener('domready', function() {
                // Set up the carousel for images
                $('#unitImageContainer').carousel({
                    interval: false
                });
                // Specify what you want the carousel to do when the .carousel-indicator is clicked
                $('.carousel-indicators li').click(function() {
                    $('#unitImageContainer').carousel(parseInt($(this).attr('data-slide-to')));
                });
            });
        });
    }

  infoWindow: function(content, map, marker) {
          google.maps.event.addListener(marker, 'click', function() {
              // If there is an open infobox on the screen, close it out
              if (ib) {
                  ib.close();
              }
              ib.setContent($('.unitInfoBox').clone().html());
              ib.open(map, marker);
              // Once the infobox is fully loaded, add your events here
              ib.addListener('domready', function() {
                  // Set up the carousel for images
                  $('#unitImageContainer').carousel({
                      interval: false
                  });
                  // Specify what you want the carousel to do when the .carousel-indicator is clicked
                  $('.carousel-indicators li').click(function() {
                      $('#unitImageContainer').carousel(parseInt($(this).attr('data-slide-to')));
                  });
                  // Arrows fix
                  $('.carousel-control').click(function() {
                    $('.map-thumbs').carousel($(this).attr('data-slide'));
                  });
              });
          });
      }