ВЕЛОЛЮБИТЕЛЯМ! |
|
КОНТАКТЫ |
ICQ: 177700574
skype: k-dezign
mail: k-dezign@mail.ru |
СТАТИСТИКА |
Онлайн всего: 1 Гостей: 1 Пользователей: 0
|
|
Скрипт: Плавная смена картинки
Код представлен ниже:
JavaScript:
<script type="text/javascript" src="jquery-1.4.4.min.js"></script>
<script type="text/javascript">
function theRotator() {
$('div#rotator div').css({opacity: 0.0});
$('div#rotator div:first').css({opacity: 1.0});
setInterval('rotate()',2000);
}
function rotate() {
var current = ($('div#rotator div.show')? $('div#rotator div.show') : $('div#rotator div:first'));
var next = ((current.next().length) ? ((current.next().hasClass('show')) ? $('div#rotator div:first') :current.next()) : $('div#rotator div:first'));
next.css({opacity: 0.0})
.addClass('show')
.animate({opacity: 1.0}, 1000);
current.animate({opacity: 0.0}, 1000)
.removeClass('show');
};
$(document).ready(function() {
theRotator();
});
</script>
HTML:
<style type="text/css">
div#rotator div { position:absolute;}
</style>
<div id="rotator">
<div class="show"><img src="1.jpg" /></div>
<div><img src="2.jpg" /></div>
<div style="text-align:center;">Текстовый<br />блок</div>
<div><img src="3.jpg" /></div>
</div>
----------
Вот как это выглядит:
---------
|
Категория: JAVA-Скрипты | Добавил: Белая_Кошка (17.08.2011)
|
Просмотров: 11803
| Рейтинг: 0.0/0 |
Добавлять комментарии могут только зарегистрированные пользователи. [ Регистрация | Вход ]
|