Setting up an image slider [closed]

-1

I studied some HTML and CSS, watched some lessons on YouTube and doing the lessons of Code Academy and now I'm creating my first website.

I want to add a slider of images, so I researched, the best option will be with jQuery itself, but this one I do not understand at all, so I tried to use some ready templates, What I liked the most was the bx slider , so I decided to use it.

I followed the instructions of the bx slider site and the slider appeared right on the site, but the "styles", the next and prev , the paging buttons and this do not appear as in bx slider examples, only text with no formatting appear.

Here is the HTML code (I hid the header because I think it does not influence the slider ):

<!DOCTYPE html5>
<html>
<head>
    <html lang="pt-br" />
        <meta charset="utf-8" />
    <title></title>    
    <link href="css/styles.css" rel="stylesheet" type="text/css">
        <link href="/lib/jquery.bxslider.css" rel="stylesheet" />
        <script src="js/jquery-2.1.1.min.js"></script>
    <script src="js/jquery.bxslider.min.js"></script>
</head>
<body>
    <header>
        ...
    </header>
    <div id="indexbanner">
        <ul class="bxslider">
          <li><img src="imgsprodutos/img (41).jpg" /></li>
          <li><img src="imgsprodutos/img (42).jpg" /></li>
          <li><img src="imgsprodutos/img (43).jpg" /></li>
        </ul>
        <script type="text/javascript">
            $(document).ready(function(){
                $('.bxslider').bxSlider({
                    auto: true,
                    autocontrols: true,
                    responsive: false,
                    touchenabled: true
                });
            });
        </script>
    </div>
</body>
</html>

The bx slider FAQ indicates that this problem can happen because the images may not be in the same folder as the CSS file, but I checked and everything is fine.     

asked by anonymous 14.05.2014 / 03:35

1 answer

1

You can start by checking if the .css and .js files are in the indicated paths.

Then test if $ (). bxSlider returns empty or exists (it's the function called to initialize the slider).

If it still does not work, I guess just looking / debugging the bxslider code to know for sure.

    
14.05.2014 / 04:59