Плавное переливание картинки - Форум
Главная Форум Гостевая книга Регистрация
[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
Страница 1 из 11
Форум » Скрипты для ucoz » Другие скрипты » Плавное переливание картинки
Плавное переливание картинки
ВэйДлинДата: Суббота, 22.05.2010, 13:08 | Сообщение # 1
Админ
Группа: Администраторы
Сообщений: 100
Репутация: 3
Статус: Offline
Плавное перелевание картинки при наведении:
В head:
Code
<script type="text/javascript">
$(function () {    
    $('#rss a')     
      .append('<span class="hover" id="rsscolor"/>').each(function () {
        var $span = $('> span.hover', this).css('opacity', 0);
        $(this).hover(function () {
          $span.stop().fadeTo(800, 1);
        }, function () {
          $span.stop().fadeTo(800, 0);
        });
      });
});
</script>

В CSS:
Code
#rss{
width:500px;
height:500px;
margin:auto;
position:relative;
display:block;}
#rss a{
   background-image:url(http://s61.radikal.ru/i174/1005/03/3cad2f0e4ce3.png);
   background-repeat: no-repeat;
   position:relative;
display:block;
width:400px;
height:300px;
}
   #rss span.hover{
   width:400px;
height:300px;
   background-image:url(http://s41.radikal.ru/i093/1005/a5/625eb84d3384.png);
   background-repeat: no-repeat;
   position:relative;
display:block;}

И в любое место где хотите видеть картинку:
Code
<div id="rss"><a href="http://nebosoft.3dn.ru/forum/0-0-0-37"></a></div>
 
Форум » Скрипты для ucoz » Другие скрипты » Плавное переливание картинки
Страница 1 из 11
Поиск:
Главная | Форум

Конструктор сайтов - uCoz
Правообладателям
         
  Баннер   Баннер