Тема: Bxslider + drag
Показать сообщение отдельно
  #6 (permalink)  
Старый 05.05.2015, 01:17
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,112

Valentinka_1,

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title></title>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
  <script src="http://bxslider.com/lib/jquery.bxslider.js"></script>
  <link rel="stylesheet" type="text/css" href="http://bxslider.com/css/styles.css">
  <link rel="stylesheet" type="text/css" href="http://bxslider.com/lib/jquery.bxslider.css">
  <style type="text/css">
  .bxslider img{
   width: 100%;
  }
#reklama_right     {
    width:350px;
    padding: 5px;
    margin: 0 auto;
    }
</style>

  <script>
$(function() {
    var c = $(".bxslider").bxSlider({
            controls: false,
            auto: false,
            speed: 500,
            randomStart: true
        }),
        d, a, e = c.getSlideCount();
    $(".bxslider").draggable({
        axis: "x",
        start: function(e, b) {
            d = b.position.left;
            a = c.getCurrentSlide()
        },
        drag: function(a, b) {},
        stop: function(f, b) {
            b.position.left > d && (a--, 0 > a && (a = e - 1));
            b.position.left < d && (a++, a == e && (a = 0));
            $(this).css({
                left: 0
            });
            c.goToSlide(a)
        }
    })
});
  </script>
</head>

<body>
<div id="reklama_right" >

<div id="slider_1" class="bxslider">
 <div><a href="http://" target="_blank"><img src="http://download-multimedia.com/images/wallpaper/medium/2/sezon_ohoti_1024x768_2252_download-multimedia.com.jpg" alt="kbn" width="240" height="240"/></a></div>
 <div><a href="http://" target="_blank"><img src="http://download-multimedia.com/images/wallpaper/medium/2/12.jpg" alt="kbn" width="240" height="240"/></a></div>
 <div><a href="http://" target="_blank"><img src="http://cartoons.kartinki-i-oboi.ru/user-content/uploads/wall/thumb/39/248013-1920x1080.jpg" alt="kbn" width="240" height="240"/></a></div>
 <div><a href="http://" target="_blank"><img src="http://brightwallpapers.ru/Uploads/2-7-2013/5831/thumb-myltfilm-oblako-piksar-pixar.jpg" alt="kbn" width="240" height="240"/></a></div>
 <div><a href="http://" target="_blank"><img src="http://www.instapics.ru/mini/201211/52978.jpg" alt="kbn" width="240" height="240"/></a></div>
 <div><a href="http://" target="_blank"><img src="http://www.bolshoyvopros.ru/files/users/images/67/2e/672e187ac1a5b9a6c029f6cbc61f7065.jpg" alt="kbn" width="240" height="240"/></a></div>

 </div>
  </div>

</body>
</html>
Ответить с цитированием