Question

我正在尝试使用bxSlider，IE8似乎似乎不合作。在这个例子中，图像滑块要么折叠要么根本不显示...很难说，因为当我打开开发人员工具进行调试时，滑块突然出现，所有看起来都很笨拙。

http://www.ilium.com/test/

另一个类似的问题是，通过打开调试控制台解决了javascript错误（在不同的幻灯片插件中）：

jQuery script only working under ie8/9 developer tools

...但是IE 似乎似乎在我的情况下抛出任何错误，并且建议的修补程序不适用于/适用于我的情况。另外，我认为我的脚本中没有console.log。我尝试在页面加载时添加任意数量的激活控制台的脚本，但无济于事。

我尝试了一个旨在解决JQuery冲突的修复程序（在另一个我还没有足够链接的站点上建议），改变了bxSlider函数调用，如下所示：

<script>// <![CDATA[ $jQ = jQuery.noConflict(); $jQ('#home').live('pageshow',function(){ $jQ('.bxslider').bxSlider({ mode: 'fade', auto: true, pager: false, controls:true, pause: 9000, }); }); // ]]> </script>

不好，并开始造成其他冲突。

在关于GitHub（https://github.com/wandoledzep/bxslider-4/issues/197）的一个问题中，有人说IE正在崩溃bxSlider中的LI，并建议添加一些CSS来给LI一个宽度。这对我也没有用。

所以现在我几个小时之后就没在这个问题上了。任何建议，医生？

Answer 1

搞笑我今天晚上碰到了同样的问题 - 在我的场景中我能够在bx-wrapper上设置一个固定的高度所以......

.bx-wrapper{
   height: 500px !important;
}

为我修好了 - 不理想，因为我希望它灵活但是在这里工作。

我尝试调试脚本并将其缩小到resizeWindow-＆gt; redrawSlider处理程序是导致显示正确的原因（不是特别是开发人员工具，而是打开它们时发生的调整大小窗口事件） - out时间，但如果我明天有更好的解决方案会让你知道。

Answer 2

我有同样的问题。对我来说，解决方案并没有按百分比调整滑动图像的大小，而是按照精确的像素数量。例如，

<li><img src="image.jpg" style="width: 561px; height: 425px;" /></li>

而不是

<li><img src="image.jpg" style="width: 170%; height: 170%;" /></li>

然后通过添加bootstrap的img-responsive类使图像再次响应。

Answer 3

我在网站上遇到了同样的问题，我所做的是纠正它而不是调整浏览器的大小（这对我来说也很有用;这就是打开开发人员工具本来就是这样做的）我添加了一些代码通过在每个图像的末尾添加任意查询，每次在IE8中重新加载图像（而不是从缓存中）。这似乎对我有用。见下文。

<div class="slide"><img src="images/your_image_name.jpg<?php if (strstr($_SERVER['HTTP_USER_AGENT'], "MSIE 8") > ""){ echo "?v=" .  time(); } ?>" ></div>

Answer 4

这是一个非常黑客的方法，但我发现它在IE8中有效 - 基本上它运行一个窗口调整大小，迫使BX滑块重新加载

将其放入窗口加载标记内。

if ($('.bxslider').length > 0) {

    slider = $('.bxslider').show().bxSlider();
    slider.reloadSlider();

}

function fireOnResizeEvent() {
 var width, height;

 if (navigator.appName.indexOf("Microsoft") != -1) {
  width  = document.body.offsetWidth;
  height = document.body.offsetHeight;
 } else {
  width  = window.outerWidth;
  height = window.outerHeight;
 }

 window.resizeTo(width - 1, height);
 window.resizeTo(width + 1, height);
}

window.onresize = function() {
    if ($('.bxslider').length > 0) {
        slider.reloadSlider();
    }
}

除非激活了开发人员工具，否则bxSlider无法在IE8中运行

4 个答案: