Witajcie. Chcę dodać na swoją stronę przesuwaną galerię bazującą na jQuery. Dokładnie jest to:
http://bxslider.com/examples/manual-show-without-infinite-loop
Na stronie głównej podana jest instrukcja. Nie bardzo wiem, co mam zrobić z punktem 3cim, gdzie umieścić ten kod:
$(document).ready(function(){
$('.bxslider').bxSlider();
});
http://bxslider.com/
Tak wygląda mój index.html :
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Usługi Transportowe Andrzej Bielawski</title>
<link rel="stylesheet" href="css/style.css">
<!-- jQuery library (served from Google) -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<!-- bxSlider Javascript file -->
<script src="js/jquery.bxslider.min.js"></script>
<!-- bxSlider CSS file -->
<link href="lib/jquery.bxslider.css" rel="stylesheet" />
<script type="text/javascript">
$('.bxslider').bxSlider({
infiniteLoop: false,
hideControlOnEnd: true
});
</script>
</head>
<body oncontextmenu="return false" onselectstart="return false" onselect="return false" oncopy="return false" ondragstart="return false" ondrag="return false" onbeforeprint="document.body.style.visibility = 'hidden'; alert('Wydruk jest niedostępny!')" onafterprint="document.body.style.visibility = 'visible'">
<div id="wrappaer"></div>
<div class="body"></div>
<div class="top">
<div class="flag1"></div>
<div class="flag2"></div>
<div class="flag3"></div>
<div class="butt"></div>
</div>
<div class="line"></div>
<footer></footer>
<ul class="bxslider">
<li><img src="images/fot1.jpg" /></li>
<li><img src="images/fot2.jpg" /></li>
<li><img src="images/fot3.jpg" /></li>
</ul>
</body>
</html>
Plik jquery.bxslider.min.js mam w katalogu o nazwie "js", natomiast jquery.bxslider.css w "lib".
Zdjęcia wyświetlają mi się normalnie, a nie w sliderze.














