gpt4 book ai didi

jquery - 使用 IE 8 在 Twitter Bootstrap 中制作 Carousel 滑动或淡入淡出

转载 作者:太空宇宙 更新时间:2023-11-03 20:49:32 24 4
gpt4 key购买 nike

我在 Twitter Bootstrap 中制作了 Carousel,它在除 IE 之外的所有浏览器中都运行良好(滑动)。现在,我真的很努力让它在IE中工作,如果不是滑动那么至少它可以淡入/淡出。

这是我做的:

$('#myCarouselforsolutions').carousel({
interval: 3000
});

var slideFrom;
var slideTo;
$('#myCarouselforsolutions').on('slide', function(e) {
slideFrom = $(this).find('.active').index();
slideTo = $(e.relatedTarget).index();


if (typeof slideTo == "undefined") {
slideTo = 2;
}
//console.log ("slide To " + slideTo + " and From " + slideFrom);
$('.media-module').removeClass('primary-one-background')
.removeClass('primary-two-background')
.removeClass('primary-three-background')
.removeClass('primary-four-background')
.removeClass('primary-five-background')
.addClass($(solution_list[slideTo]).attr('value'));
});



$("#prev-solution, #next-solution").click(function(e) {
//e.preventDefault();


});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="module colored home-solutions primary-two-background">


<div id="myCarouselforsolutions" class="carousel slide">
<div class="carousel-inner carousel-inner-at-home">


<div class="content-container">

<h1 id="num-solutions"></h1>
<h2>SOLUTIONS</h2>
<div id="swipe-container-home-solutions">

<div class="item active" id="solutions-slide-dimensions">

<div class="solution-preview" value="primary-two-background">
<a href="/Index/solutions/periscope/">
<h2>Periscope</h2>
</a>
<p>
Improves return on sales through better pricing, promotions, assortment, and performance management</p>
</div>

</div>

<div class="item" id="solutions-slide-dimensions">

<div class="solution-preview" value="primary-five-background">
<a href="/Index/solutions/objective-health/">
<h2>Objective Health</h2>
</a>
<p>Supports community hospitals and small regional systems to improve their cost performance and strategy</p>
</div>

</div>



</div>

</div>



</div>
<a class="arrow arrow-left hidden-phone" href="#myCarouselforsolutions" data-slide="prev"></a>
<a class="arrow arrow-right hidden-phone" href="#myCarouselforsolutions" data-slide="next"></a>
</div>



</div>

最佳答案

我也在寻找解决方案,这个解决方案甚至在 Bootstrap 3 上也对我有所帮助: https://github.com/tybruffy/ie-bootstrap-carousel - 在此处下载 ie-bootstrap-carousel.min.js,然后在 bootstrap.min.js 之后包含它:

<body>
<!-- Bootstrap -->
<script src="bootstrap/js/bootstrap.min.js"></script>
<!-- /Bootstrap -->
...
<!--[if lte IE 9]>
<script src="ie/ie-bootstrap-carousel.min.js"></script>
<![endif]-->
...

关于jquery - 使用 IE 8 在 Twitter Bootstrap 中制作 Carousel 滑动或淡入淡出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17373826/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com