Encountering an issue with my bx slider. It functions properly on desktops, and even when you resize the screen down. However, on mobile devices, the second slide image disappears.
You can view the live site here:
This is the HTML code used:
<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: ($(".bxslder li").length > 1) ? true: false,
controls: false
});
</script>
I am unsure of what's causing this issue, any assistance would be greatly appreciated.
Lee