3

我正在尝试使用 bxSlider,而 IE8 似乎不会合作。在此示例中,图像滑块要么折叠,要么根本不显示......很难说,因为当我打开开发者工具进行调试时,滑块突然出现,一切看起来都很笨拙。

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

还有另一个类似的问题,其中有一个 javascript 错误(在不同的幻灯片插件中),通过打开调试控制台解决了:

jQuery 脚本只在 ie8/9 开发者工具下工作

...但在我的情况下,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 提供宽度。这对我也不起作用。

所以现在几个小时后我在这个问题上完全无处可去。有什么建议吗,医生?

4

4 回答 4

0

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

<div class="slide"><img src="images/your_image_name.jpg<?php if (strstr($_SERVER['HTTP_USER_AGENT'], "MSIE 8") > ""){ echo "?v=" .  time(); } ?>" ></div>
于 2014-04-14T14:17:13.517 回答
0

有趣的是,我今晚遇到了同样的问题——在我的场景中,我能够在 bx-wrapper 上设置一个固定的高度,所以......

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

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

我尝试调试脚本并将其范围缩小到 resizeWindow->redrawSlider 处理程序是导致显示正确的原因(不是特别是开发人员工具,而是打开它们时发生的调整大小窗口事件) - 超时但如果我有更好的解决方案明天会告诉你。

于 2013-10-15T05:24:20.510 回答
0

我遇到过同样的问题。对我来说,解决方案不是按百分比调整滑动图像的大小,而是按像素的确切数量。例如,

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

代替

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

然后通过添加引导程序的 img-responsive 类使图像再次响应。

于 2014-01-22T13:30:22.560 回答
0

这是一种非常 hacky 的方法,但我发现它在 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();
    }
}
于 2015-11-12T12:53:51.097 回答