Slyweb
На разработку сайта! Скидки 50%!

Скорость прокрутки слайдов

Вы можете задавать любые вопросы по jQuery.

Скорость прокрутки слайдов

Сообщение Gradyslav » 01 сен 2013, 06:05

Добрый день. Есть код слайдера, но прокрутка очень быстрая, пытаюсь изменить скорость - ничего не выходит. Подскажите, как сделать скорость слайдера медленнее.
Вот код слайдера:
Код: Выделить всё
<!DOCTYPE html>
<html>
   <head>
      <!--
         This carousel example is created with jQuery and the carouFredSel-plugin.
         http://jquery.com
         http://caroufredsel.frebsite.nl
      -->

      <meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
      
      <title>Automatic slideshow with a timer, play-, pause-, previous- and next-button</title>

      <script src="lybrary/jquery-1.8.2.min.js" type="text/javascript"></script>
      <script src="lybrary/jquery.carouFredSel-6.0.4-packed.js" type="text/javascript"></script>
      <script type="text/javascript">
         $(function() {
            $('#carousel').carouFredSel({               
               prev: '#prev',
               next: '#next',
               auto: {                        
                  button: '#play',
                  progress: '#timer',                  
                  pauseOnEvent: 'resume'                  
               },
               scroll: {                                    
                  fx: 'fade'                  
               }
            });
            $('#wrapper').hover(function() {
               $('#navi').stop().animate({                  
                  bottom: 0
               });
            }, function() {
               $('#navi').stop().animate({
                  bottom: -60
               });
            });
            
            
         });
      </script>
      <style type="text/css">
      

         #wrapper {
            border: 1px solid #ccc;
            background-color: #fff;
            width: 370px;
            height: 310px;
            padding: 20px;
            margin: -220px 0 0 -320px;
            position: absolute;
            left: 50%;
            top: 50%;
            box-shadow: 0 5px 10px #ccc;
         }
         #inner {
            position: relative;
            width: 370px;
            height: 310px;
            overflow: hidden;
         }
      
         #carousel img {
            display: block;            
            float: left;
         }

         #navi {
            background-color: #333;
            background-color: rgba(30, 30, 30, 0.8);
            border-top: 1px solid #000;
            width: 370px;
            height: 70px;
            position: absolute;
            bottom: -60px;
            left: 0;
            z-index: 10;
         }
         #timer {
            background-color: #222;
            background-color: rgba(20, 20, 20, 0.8);
            width: 0;
            height: 70px;
            position: absolute;
            z-index: 20;
            top: 0;
            left: 0;
         }
         #prev, #next, #play {
            display: block;
            position: absolute;
            z-index: 30;
         }
         #prev, #next {
            width: 47px;
            height: 47px;
            top: 13px;
         }
         #play {
            width: 53px;
            height: 53px;
            top: 10px;
            background: url(images/ui/pause.png) 0 0 no-repeat transparent;
            left: 50%;
            margin-left: -27px;
         }
         #play.paused {
            background: url(images/ui/play.png) 0 0 no-repeat transparent;
         }
         #prev {
            background: url(images/ui/prev.png) 0 0 no-repeat transparent;
            left: 220px;
         }
         #next {
            background: url(images/ui/next.png) 0 0 no-repeat transparent;
            right: 220px;
         }
         
      
      </style>
   </head>
   <body>
      <div id="wrapper">
         <div id="inner">
            <div id="carousel">
               <img src="images/slide1.png" alt="rally1" width="370" height="300" border="0" />
               <img src="images/rally2.jpg" alt="rally2" width="370" height="300" border="0" />
               <img src="images/rally3.jpg" alt="rally3" width="370" height="300" border="0" />
               <img src="images/rally4.jpg" alt="rally4" width="370" height="300" border="0" />
            </div>
            <div id="navi">
               <div id="timer"></div>
               <a id="prev" href="#"></a>
               <a id="play" href="#"></a>
               <a id="next" href="#"></a>
            </div>
         </div>
      </div>
      
      
   </body>
</html>
Gradyslav
 
Сообщения: 2
Зарегистрирован: 01 сен 2013, 06:03

Re: Скорость прокрутки слайдов

Сообщение admin » 01 сен 2013, 12:06

Код: Выделить всё
scroll: {                               
fx: 'fade',
duration:5000                
}
admin
Администратор
 
Сообщения: 165
Зарегистрирован: 15 авг 2009, 20:02

Re: Скорость прокрутки слайдов

Сообщение Gradyslav » 01 сен 2013, 15:16

Благодарю за помощь)
Огромное спасибо)
Gradyslav
 
Сообщения: 2
Зарегистрирован: 01 сен 2013, 06:03


Вернуться в Вопросы по jQuery

Кто сейчас на конференции

Сейчас этот форум просматривают: нет зарегистрированных пользователей и гости: 0

cron