здравствуйте.
Помогите пожалуйста до работать скрипт смены блоков. Хотелось бы чтобы чтобы с помощью данного скрипта они плавно появлялись хотя бы.
Сам скрипт
<script>
$elements = $('.rotating-content').find('span');
$elements
.not(':first-child')
.addClass('visually-hidden')
.css('opacity', 0);
setInterval(function() {
$elements.filter(':not(.visually-hidden)').fadeTo('slow', 0, function() {
$next = $(this).addClass('visually-hidden').next();
if ($next.length === 0) {
$next = $elements.first();
}
$next.removeClass('visually-hidden').fadeTo('slow', 1);
});
}, 9000);</script>
Стили его
Код:
|
<style>
.rotating-content
{
height:215px;
}
.visually-hidden
{clip:rect(0 0 0 0);
height:1px;
margin:-1px;
overflow:hidden;
padding:0;
position:absolute;
width:1px
}</style> |
Ну и само тело
Код:
|
<div class="rotating-content">
<span>БЛОК 1</span>
<span>БЛОК 2</span>
<span>БЛОК 3</span>
</div> |