Question

我的bx滑块出现问题。它在桌面计算机上运行良好，甚至可以在您将桌面屏幕向下移动时正常工作。但是当你在移动设备上时，第二张幻灯片图像会消失。

我的HTML是：

<ul class="bxslider">
<li><img src="<?php echo get_template_directory_uri(); ?>/images/penthouse-bedroom.jpg" /></li>
<li><img src="<?php echo get_template_directory_uri(); ?>/images/reception1.jpg" /></li>
</ul>

<!--BX Slider Plugin-->
        <script type="text/javascript" src="<?php bloginfo("template_url"); ?>/js/jquery.bxslider.js"></script>
        <script type="text/javascript">
                $('.bxslider').bxSlider({
            infiniteLoop: true,
            auto: ($(".bxslider li").length > 1) ? true: false,
            pager: ($(".bxslider li").length > 1) ? true: false,
            controls: false
        });

        </script>

我不确定会发生什么事情，如果有人能提供帮助那就太好了。

利

Answer 1

我可以使用Nexus 5上设置的Chrome设备模拟器重现此问题。移动设备上的空白幻灯片似乎包含宽度和高度设置为0的图片标记

<img src="http://mistleymanor.com/wp-content/themes/Mistley-Manor/images/reception1@2x.jpg" width="0" height="0">

Bx Slider第二张幻灯片未在移动设备上显示

1 个答案: