I want to show some images in a slider, I used BxSlider for this. But it isn't showing up in Google Chrome

I've tried testing it in: Edge and Firefox and it did SHOW the slider.

Result - Chrome

Expected Result - Firefox

   $(window).on('load', function() {
        $('.bxslider').bxSlider({
            pagerCustom: '#bx-pager',
            adaptiveHeight: true,     
        });
    })
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="ads-image">
                                <h1 class="pricetag"> $25</h1>
                                <ul class="bxslider">
                                    <li>
                                        <img src="https://www.nbc.nl/sites/default/files/styles/detail_page/public/kaas-280x280.jpg?itok=F2UV567Z"
                                            alt="img" />
                                    </li>
                                </ul>
                                <div id="bx-pager">
                                    <a class="thumb-item-link" data-slide-index="0" href="">
                                        <img src="https://www.nbc.nl/sites/default/files/styles/detail_page/public/kaas-280x280.jpg?itok=F2UV567Z"
                                            alt="img" />
                                    </a>

                                </div>
                            </div>

The images are loaded in HTML but they're not showing it.

0 Answers