• Страница 1 из 1
  • 1
эффект для изображении
sasa96
Дата: Понедельник, 24.01.2011, 21:39 | Сообщение # 1
молчун
Группа: Проверенные
Пользователь №: 3139
Сообщений: 33
Помогите сделать эффект для изображения. Мне нужно, чтоб когда мышь наводилась на изображение, оно (изображение) плавно менялось на другое.
  
sasha
Дата: Вторник, 25.01.2011, 23:29 | Сообщение # 2
молчун
Группа: Пользователи
Пользователь №: 3712
Сообщений: 5
Code
<script type="text/javascript">
var op=1;
function f1()
{
          op-=0.1;
          document.getElementById('img').style.opacity=op;
          if (op>0.1) setTimeout('f1();',100);
          else
          {
          document.getElementById('img').src='/img1.jpg';
          setTimeout('f2();',100);
          }
}
function f2()
{
          op+=0.1;
          document.getElementById('img').style.opacity=op;
          if (op<0.9) setTimeout('f2();',100);
          else
          document.getElementById('img').style.opacity='1'
}
</script>

Code
<img src="/img2.jpg" alt="" onmouseover="f1();" />
  
sasa96
Дата: Среда, 26.01.2011, 22:15 | Сообщение # 3
молчун
Группа: Проверенные
Пользователь №: 3139
Сообщений: 33
sasha, можно подробнее... То-есть как работает и как использовать.
  
sasha
Дата: Четверг, 27.01.2011, 12:54 | Сообщение # 4
молчун
Группа: Пользователи
Пользователь №: 3712
Сообщений: 5
Code
<script type="text/javascript">
var op=1;
function f1() /* исчезает */
{
          op-=0.1; /* делаем изображение более прозрачным (может меняться от 0 до 1) */
          document.getElementById('img').style.opacity=op;
          if (op>0.1) setTimeout('f1();',100); /* если ещё не совсем прозрачное, то вызываем эту же функцию через 100 мс */
          else
          {
          document.getElementById('img').src='/img1.jpg'; /* а если уже прозрачное, то меняем изображение и вызываем другую функцию, что бы появилось новое изображение */
          setTimeout('f2();',100);
          }
}
function f2() /* появляется */
{
          op+=0.1;
          document.getElementById('img').style.opacity=op;
          if (op<0.9) setTimeout('f2();',100);
          else
          document.getElementById('img').style.opacity='1'
}
</script>
  
  • Страница 1 из 1
  • 1
Поиск:
© Studioad.ru 2006 · 2010. Использование материалов форума на сторонних ресурсах без прямой обратной ссылки строго запрещено. Хостинг от uCoz.