How enable loader in bx slider

Question

The loader is not enabled in my bxslider, how to enable it

bx slider version 1.4

JavaScript code

$(document).ready(function() {
 $('.bxslider').bxSlider({
            mode: 'fade',
            auto: true,
            pause: 5000,
            speed: 2000,
            autoStart:false,
            preloadImages:'all',
 });
});

In Html the list element contain inner elements

<div class="baner-slider">
    <ul class="bxslider">
      <li>
        <span class="baner baner-1 ">
            <span class="bg-shadow">
                <span class="h1">g</span>
                <span class="h4">We es</span>
                <a href="#">learn more</a>
            </span>
        </span>
      </li>
      <li>
        <span class="baner baner-2 ">
            <span class="bg-shadow">
                <span class="h1">Nd</span>
                <span class="h4">edefefe</span>
                <a href="#">learn more</a>
            </span>
        </span>
      </li>
      <li>
        <span class="baner baner-3">
            <span class="bg-shadow">
                <span class="h1">ry</span>
                <span class="h4">Ags .</span>
                <a href="#">learn more</a>
            </span>
        </span>
      </li>
     <li>
        <span class="baner baner-4">
            <span class="bg-shadow">
                <span class="h1">A</span>
                <span class="h4">A Academia.</span>
                <a href="#">learn more</a>
            </span>
        </span>
      </li>
    </ul>
    <div class="arrow" id="arrw">
        <img src="img/icons/arrw.png" alt="">
    </div>
    <div class="event-wrap hidden-xs hidden-sm">
    <a href="http://intlpag.org/" target="_blank"><h4>Visit us at booth #507 at PAG 2017</h4></a>
</div>

The latest version is 4.2.5 I believe. Did you include jQuery before the bxSlider? I don't see any images in your HTML, bxSlider needs something that has height and width. — zer00ne
I see, so what exactly is the result you see on screen and what error is in console? I'm also curious do you see any of the images? — zer00ne
the issue is fixed when i add image as img tag instead the background url of <span class="baner baner-N"> — Sajan
If you still want to use image-background, try removing the preloadImages:'all', and instead of a <span> use a div — zer00ne

Sajan Sajan · Accepted Answer · 2016-11-26T05:47:49

0

votes

The issue is solved when i added img tag inside li

Thanks to zer00ne for help

How enable loader in bx slider

1 Answers