2

我知道这对于某些幻灯片转换在 IE 中不起作用的人来说一直是个问题。 我在 SO和网络上多次看到的解决方案是将类添加slide到 myCarousel div。所以，我访问了 Bootstrap 网站并将标准轮播的代码复制并粘贴到我的网页中，并且......在 IE 中没有过渡。我什至在 IE 中访问了Twitter Bootstrap 的 Carousel 页面，你猜怎么着？IE9及以下在他们自己的页面上没有过渡，他们甚至添加了类slide到 myCarousel div。Bootstrap 2.0 的其他人是否会遇到这种情况（我在我的页面上使用最新的 JQuery 副本，1.8.0，如果这有所不同的话。另外，我正在使用自定义版本的 Bootstrap，其中包含转换和轮播捆绑到bootstrap.js 文件）。这是我复制和粘贴的代码，针对我自己的图像进行了修改：

<div id="myCarousel" class="carousel slide">
        <div class="carousel-inner">
          <div class="item active">
            <img src="img/CRC615_LivingRoom_cropped.jpg" alt="A living room with wrap around balcony and view of Gulf of Mexico at Caribe Resort">
            <div class="carousel-caption">
              <h4>First Thumbnail label</h4>
              <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
            </div>
          </div>
          <div class="item">
            <img src="img/OutcastCharterDocks-rentals-charters-cruises.jpg" alt="Outcast Marina in Orange Beach offers vacationers parasailing and jetski rentals">
            <div class="carousel-caption">
              <h4>Second Thumbnail label</h4>
              <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
            </div>
          </div>
          <div class="item">
            <img src="img/CobaltRestaurantOrangeBeach.jpg" alt="">
            <div class="carousel-caption">
              <h4>Third Thumbnail label</h4>
              <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
            </div>
          </div>
        </div>
        <a class="left carousel-control" href="#myCarousel" data-slide="prev">&lsaquo;</a>
        <a class="right carousel-control" href="#myCarousel" data-slide="next">&rsaquo;</a>
      </div>
4

2 回答 2

3

现在已修复，请获取最新版本的引导程序或我所做的，因为我已经使用旧版本完成了检查，请点击此处 http://tutewall.com/bootstrap-carousel-transition-fixed/

于 2012-09-13T21:58:24.633 回答
2

Twitter Bootstrap 的 Carousel 插件使用 CSS3 过渡。 IE9 不支持 CSS3 过渡。

如果您想在 IE 中进行转换，您需要找到一个 shim 或一些代码修改（如评论中所建议的那样）以添加支持。

于 2012-08-15T17:15:34.960 回答