VPF::Анимация изображений - Форум программистов

Alexey91

Дата 7.9.2010, 12:38 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 195
Регистрация: 18.9.2008

Репутация: нет
Всего: нет

Здравствуйте!!!

У меня есть набор изображений. Нужно сделать, чтобы эти изображения сменяли друг друга с различной
скоростью: можно увеличивать скорость смены, уменьшать.

Код


<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 3.2//RU">

<HTML><HEAD>
<META HTTP-EQUIV="CONTENT-TYPE" CONTENT="text/html; charset=Windows-1251">
<TITLE>ani</TITLE>

<style type="text/css"></style>

<script language="javascript">

i=1;

function animate(t)
{


 document.images[0].src="s"+i+".gif";
 i+=1;
 if (i==4) i=1;
 
t1=setTimeout(function(){animate(t)}, t); 
return t;
}




</script>

</HEAD> 

<BODY BGCOLOR="white" 
 TEXT="black" LINK="blue" ALINK="red" VLINK="green">

<img src="s1.gif">

<form name="f22_1">
  <input type="button" value="play" onClick="animate('500')">      
  <input type="button" value=">>>" onClick="clearTimeout(t1); animate('250')">     
  <input type="button" value="<<<" onClick="clearTimeout(t1); animate('2000')">
  <input type="button" value="stop" onClick="clearTimeout(t1)">   
   
</form> 
 
</BODY>
</HTML>

Проблема в том, что если я много раз начинаю нажимать кнопку play, анимация сильно ускоряется (не понимаю почему), и замедлить ее нету возможности...

что делать не знаю..

magelan

Дата 7.9.2010, 12:46 (ссылка)

(нет голосов)

Загрузка ...

потерял xPath

Профиль
Группа: Участник
Сообщений: 393
Регистрация: 5.4.2010

Репутация: 3
Всего: 16

Думаю, надо делать как-то так.

Код


<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 3.2//RU">

<HTML><HEAD>
<META HTTP-EQUIV="CONTENT-TYPE" CONTENT="text/html; charset=Windows-1251">
<TITLE>ani</TITLE>

<style type="text/css"></style>

<script language="javascript">

var t1 = null;
i=1;

function animate(t)
{
   stopAnimate(t1); 

 document.images[0].src="s"+i+".gif";
 i+=1;
 if (i==4) i=1;
 
t1=setTimeout(function(){animate(t)}, t); 
return t;
}

var stopAnimate = function( tid )
{
    if( tid != null )
    {
        clearTimeout( tid );
        tid = null;
    }
}


</script>

</HEAD> 

<BODY BGCOLOR="white" 
 TEXT="black" LINK="blue" ALINK="red" VLINK="green">

<img src="s1.gif">

<form name="f22_1">
  <input type="button" value="play" onClick="animate('500')">      
  <input type="button" value=">>>" onClick="animate('250')">     
  <input type="button" value="<<<" onClick="animate('2000')">
  <input type="button" value="stop" onClick="stopAnimate(t1)">   
   
</form> 
 
</BODY>
</HTML>

Alexey91

Дата 7.9.2010, 12:56 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 195
Регистрация: 18.9.2008

Репутация: нет
Всего: нет

Конец.

Модераторы, поставьте + магелану

Это сообщение отредактировал(а) Alexey91 - 7.9.2010, 16:19

magelan

Дата 7.9.2010, 17:41 (ссылка)

(нет голосов)

Загрузка ...

потерял xPath

Профиль
Группа: Участник
Сообщений: 393
Регистрация: 5.4.2010

Репутация: 3
Всего: 16

по хорошему это тоже не очень коректно:

Код


i+=1;
if (i==4) i=1;

лучше писать так:

Код


i++;
if (i>3) i=1;

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: для новичков \| Следующая тема »