2015-10-08 1 views
0

Unslider плагин - Как установить 3 секунду задержки для первого слайда

$('.banner').unslider({ 
 
\t speed: 500,    // The speed to animate each slide (in milliseconds) 
 
\t delay: 3000,    // The delay between slide animations (in milliseconds) 
 
\t complete: function() {}, // A function that gets called after every slide animation 
 
\t keys: true,    // Enable keyboard (left, right) arrow shortcuts 
 
\t dots: true,    // Display dot navigation 
 
\t fluid: false    // Support responsive design. May break non-responsive designs 
 
});
.banner { position: relative; overflow: auto; } 
 
    .banner li { list-style: none; } 
 
     .banner ul li { float: left; }
<div class="banner"> 
 
    <ul> 
 
     <li>This is a slide.</li> 
 
     <li>This is another slide.</li> 
 
     <li>This is a final slide.</li> 
 
    </ul> 
 
</div> 
 
<script src="//code.jquery.com/jquery-latest.min.js"></script> 
 
<link href="http://unslider.com/style.css" rel="stylesheet"/> 
 
<script src="//unslider.com/unslider.min.js"></script>

Как можно установить задержку в 3 сек первого слайда (пункт) только другой слайд (пункт) будет двигаться 9 сек unslider плагина.

Уже плагин имеет такую ​​же задержку весь слайд.

Ссылка плагин http://unslider.com/

+0

вы можете упомянуть плагин вы используете @anithaappu – vickisys

+0

unslider плагин –

ответ

0

Согласно Unslider документации он не имеет опцию времени задержки набора для каждого слайда как сейчас. Попробуйте изменить файл библиотеки самостоятельно.

Включите <link href="http://unslider.com/style.css" rel="stylesheet"/> в свой код.

$(function() { 
 
    $('.banner').unslider(); 
 
});
.banner { position: relative; overflow: auto; } 
 
.banner li { list-style: none; } 
 
.banner ul li { float: left; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="http://unslider.com/style.css" rel="stylesheet"/> 
 
<script src="http://unslider.com/unslider.js"></script> 
 

 

 
<div class="banner"> 
 
    <ul> 
 
    <li>This is a slide.</li> 
 
    <li>This is another slide.</li> 
 
    <li>This is a final slide.</li> 
 
    </ul> 
 
</div>

Смежные вопросы