Question

我在我的页面（BXSlider）中添加了一个JQuery Slider，几乎每个页面（在每个浏览器中）都可以正常工作，除了IE（7＆amp; 8）中的这个。

滑块中的图像被加载但是它显示的是一个大的空白空间而不是滑动的表格（是的，此时它需要是一个表格）！

对不起发布的链接，但我无法想出这一个，我不知道我应该在这里添加哪个代码...是CSS问题还是JQuery / Javascript相关？

我希望有人能指出正确的方向......

非常感谢，约亨

Answer 1

正如我在上面的评论中提到的那样。你实现滑块的方式会产生不正确的html。 bxslider在td之外包含两个包含图像的div，因此你得到一个像这样的HTML结构： table＆gt; tr> div> div> td ，这就是IE出现问题的原因 - 浏览器是正确的。如果你无法摆脱桌子（我更喜欢），请执行以下操作：

修改滑块表的HTML，如下所示：

<table border="0">
    <tbody>
        <tr>
            <td>
                <div class="bx-box">[.. YOUR LINKS AND IMAGES .. ]</div>
            </div>
        </tr>
    </tbody>
</table>

在JS中这样做：

$(function(){
    // change your your selector to the nested div container
    // and tada it works in ie too.
    $('td .bx-box').bxSlider({
        infiniteLoop: true,
        hideControlOnEnd: true
    });
});

现在，在bxSlider添加包装器div并且滑块显示跨浏览器之后，代码保持有效。你会找到demo here。并帮自己一个忙，验证你的代码，里面有更多的错误（双关闭标签和其他），这可能会导致最奇怪的布局行为。

使用JQuery-Slider的IE-Bug

1 个答案: