图像滑块无法正确加载

Question

This is the html for my website. I would like to add this image slider: . I have one problem, for some reason all I get is 4 bullet point and a error img picture next to it. Could you look at my html and see what you could do to help.

-Thanks

http://jsfiddle.net/lasquish/hL7vLcd5/

<div class="container">
    <ul class="slider">
        <li><img src="/images/Day1.jpg" /></li>
        <li><img src="/images/Day1.jpg" /></li>
        <li><img src="/images/Day1.jpg" /></li>
        <li><img src="/images/Day1.jpg" /></li>
    </ul>
</div>

This is the Script:

<script src="js/jquery.bxslider.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src = "js/bootstrap.js"></script>
<script>
    $(document).ready(function(){
        $('.bxslider').bxSlider();
    });
</script>

Answer 1

Since you have wrapped slide content with .slider class you need to do following changes

$(document).ready(function(){
    $('.slider').bxSlider();
});

Call bxslider.min.js after jQuery library Also you have call 2 different version of jQuery library. this will make conflict.

Answer 2

1. You need to add below css to remove bullet

   ul { list-style-type: none; }

2. Need to use correct image path or you can use full image " http://fiddle.jshell.net/img/logo.png "...

As you have not shared all required file here ..so we unable to test at our end. Please share js library file which you have include here if problem no solve.