Модераторы: Sardar, Aliance
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Как внедрить цикл в скрипт? Смена картинок с помощью цикла 
:(
    Опции темы
MNDRK
  Дата 6.8.2008, 15:13 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



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

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



Есть желание сделать простенькую анимацию, что-то вроде бегущих огней. Написал пока вот это:
Код

<html>
 <head>
  <title></title>
<script language="JavaScript">
 function setbutton1()
{
    window.setTimeout( "setbutton2()", 250);
   var index=1
   var mypic1="4.png";
if(index == 1)
    mypic1="change.png";
document.mypic1.src=mypic1;
}
 function setbutton2()
{
    window.setTimeout( "setbutton3()", 250);
   var index=2
   var mypic2="4.png";
if(index == 2)
    mypic2="change.png";
document.mypic2.src=mypic2;
}
 function setbutton3()
{
    window.setTimeout( "setbutton4()", 250);
   var index=3
   var mypic3="4.png";
if(index == 3)
    mypic3="change.png";
document.mypic3.src=mypic3;
}
 function setbutton4()
{
    window.setTimeout( "setbutton5()", 250);
   var index=4
   var mypic4="4.png";
if(index == 4)
    mypic4="change.png";
document.mypic4.src=mypic4;
}
 function setbutton5()
{
    window.setTimeout( "setbutton6()", 250);
   var index=5
   var mypic5="4.png";
if(index == 5)
    mypic5="change.png";
document.mypic5.src=mypic5;
}
 function setbutton6()
{
    window.setTimeout( "setbutton7()", 500);
   var index=6
   var mypic6="4.png";
if(index == 6)
    mypic6="change.png";
document.mypic6.src=mypic6;
}
 function setbutton7()
{
    window.setTimeout( "setbutton8()", 250);
   var index=0
   var mypic1="4.png";
if(index == 1)
    mypic1="change.png";
document.mypic1.src=mypic1;
}
 function setbutton8()
{
    window.setTimeout( "setbutton9()", 250);
   var index=0
   var mypic2="4.png";
if(index == 2)
    mypic2="change.png";
document.mypic2.src=mypic2;
}
 function setbutton9()
{
    window.setTimeout( "setbutton10()", 250);
   var index=0
   var mypic3="4.png";
if(index == 3)
    mypic3="change.png";
document.mypic3.src=mypic3;
}
 function setbutton10()
{
    window.setTimeout( "setbutton11()", 250);
   var index=0
   var mypic4="4.png";
if(index == 4)
    mypic4="change.png";
document.mypic4.src=mypic4;
}
 function setbutton11()
{
    window.setTimeout( "setbutton12()", 250);
   var index=0
   var mypic5="4.png";
if(index == 5)
    mypic5="change.png";
document.mypic5.src=mypic5;
}
 function setbutton12()
{
    window.setTimeout( "setbutton1()", 500);
   var index=0
   var mypic6="4.png";
if(index == 6)
    mypic6="change.png";
document.mypic6.src=mypic6;
}
</script>
 </head>

<body bgcolor="#FFFFFF" alink="#FF0000" vlink="#FF0000" link="#FF0000" text="#FF0000" Onload="setbutton1()">

<table align="right" width="160" border="0" bgcolor="black">
  <tr cellspacing="0" background="back.png" width="160" height="29"><td align="center"></td></tr><tr><td>
<table width="156" border="0" bgcolor="black">
  <tr background="back.png"><td><a href="http://www."><img src="4.png" name="mypic1" border="0" align="left">Ваша реклама</a></td></tr>
  <tr background="back.png"><td><a href="http://www."><img src="4.png" name="mypic2" border="0" align="left">Ваша реклама</a></td></tr>
  <tr background="back.png"><td><a href="http://www."><img src="4.png" name="mypic3" border="0" align="left">Ваша реклама</a></td></tr>
  <tr background="back.png"><td><a href="http://www."><img src="4.png" name="mypic4" border="0" align="left">Ваша реклама</a></td></tr>
  <tr background="back.png"><td><a href="http://www."><img src="4.png" name="mypic5" border="0" align="left">Ваша реклама</a></td></tr>
  <tr background="back.png"><td><a href="http://www."><img src="4.png" name="mypic6" border="0" align="left">Ваша реклама</a></td></tr>
</table>
</td></tr>
  <tr cellspacing="0" background="back.png" width="160" height="29"><td align="right"></td></tr></td></tr>
</table>
</html>

Оно то работает, но это не скрипт, а гемморой какой-то, понимаю, что проблему можно решить, используя цикл, скрипт будет короче и проще, но все примеры в инете по использованию циклов написаны для чего угодно, но не для работы с графическими обьектами. Ума не приложу, как его туда засунуть?
Где-то неделю назад начал учить Javascript, это мой первый язык программирования. Так что сильно не пинать, также прошу прощения, если похожая тема уже была, поиск ничего не дал.

Это сообщение отредактировал(а) MNDRK - 7.8.2008, 01:27
PM MAIL   Вверх
Ockonal
Дата 7.8.2008, 14:20 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Smile
*


Профиль
Группа: Участник
Сообщений: 219
Регистрация: 9.7.2007
Где: Ukraine::Nikolaev ;

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



Вообще, не разбирался в скрипте smile Уж больно
Цитата

гемморой какой-то

Делай функцию-шаблон. Например:
Код

var changePict = "change.png";
var myPic="4.png";

function templateSetButton( functionNum, in, picNum ) {
  window.setTimeout( functionNum, 250);
  var index = in;
  picNum = "4.png";
  if( index == in )
    picNum = "change.png";

  document.picNum.src = myPic;
}

Далее сами, а то мне местами не всегда понятен смысл кода.
--------------------
Ум заключается не только в знании, но и в умении прилагать знание на деле.Самое лучшее из всех доказательств есть опыт.Каждому человеку свойственно ошибаться, но никому, кроме глупца, несвойственно упорствовать в ошибке.
PM MAIL WWW ICQ Skype GTalk Jabber MSN   Вверх
MNDRK
Дата 7.8.2008, 22:12 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



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

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



Цитата(Ockonal @ 7.8.2008,  14:20)
Вообще, не разбирался в скрипте smile Уж больно
Цитата

гемморой какой-то

Делай функцию-шаблон. Например...

Далее сами, а то мне местами не всегда понятен смысл кода.

Оно и неудивительно, что код непонятен, говорю ведь только пробую писать, никогда таким не занимался. Спасибо за попытку помочь, но мне непонятен сам принцип привязки функции к циклу, как вызывать функцию с помощью цикла изменяя параметры расположенных/ой в ней переменных/ой. Понимаю, что нуб полный, не знаю основных принципов написания скриптов, при этом все-равно что-то калякаю, но если бы сам мог догнать то, что в книгах написано, то сюда не писал бы. Может кто встречал где-то на каком сайте что-то подобное - ткните носом плииз. Или может где-то урок есть с чем-то вроде этого. Это с работой никак не связано - учу для себя, так что срочность не требуется, главное помогите разобраться с основами построения скриптов. Еще раз спасибо.
PM MAIL   Вверх
NightmareZ
Дата 7.8.2008, 23:00 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


[хакер]
**


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

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



Если ты не можешь понять элементарные основы в книгах, то форум тебе не поможет.


--------------------
NightmareZ.net - мой блог и сайт, мои проекты и прочий трэш
Ely-Art.ru - наша маленькая домашняя арт-студия
mugcraft.ru - кружки на любой вкус
PM WWW ICQ Skype GTalk AOL YIM   Вверх
Ockonal
Дата 7.8.2008, 23:57 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Smile
*


Профиль
Группа: Участник
Сообщений: 219
Регистрация: 9.7.2007
Где: Ukraine::Nikolaev ;

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



Цитата

Понимаю, что нуб полный, не знаю основных принципов написания скриптов, при этом все-равно что-то калякаю, но если бы сам мог догнать то, что в книгах написано, то сюда не писал бы. Может кто встречал где-то на каком сайте что-то подобное - ткните носом плииз. Или может где-то урок есть с чем-то вроде этого. Это с работой никак не связано - учу для себя, так что срочность не требуется, главное помогите разобраться с основами построения скриптов. Еще раз спасибо.

Ну что же... Не надо преуменьшать своих возможностей smile Попытаюсь как-то объяснить:

Здесь мы задаем одну переменную( вы постоянно переопределяете ее в каждой функции )
var changePict = "change.png";
Имя вашей картинки. Аналогично верхнему
var myPic="4.png";

А вот сама функция-шаблон. Нужно понять ее суть. Вы, надеюсь, заметили, что все ваши функции похожи и выполняют только одну функцию, просто работает по-разному из-за разной информации( значения переменных ).

functionNum - этот параметр я зря сделал, так как не сразу вник в смысл кода
function templateSetButton( functionNum, in, picNum ) {
  Ниже - тоже выбросить нужно
  window.setTimeout( functionNum, 250);
  var index = in;
  picNum = myPic
  if( index == in )
    picNum = changePict;
  document.picNum.src = myPic;
}

теперь мы сочиняем цикл, который будет проходить по всех рисунках, и выводить их такое-то время:
У нас таких проходов 12 штук:
for( i=0;i<=12; i++ ) {
  Здесь мы будем использовать нашу функцию шаблон:
  выполняем все функции с интервалом таким-то smile
  window.setTimeOut( templateSetButton( i ), 250 );
};

Дальше сами smile Уж поздновато уже у меня ;). Приведу полный код:
Код

function templateSetButton( in, picNum ) {;
  var index = in;
  picNum = myPic
  if( index == in )
    picNum = changePict;
  document.picNum.src = myPic;
}

for( i=0;i<=12; i++ ) {
  window.setTimeOut( templateSetButton( i, mypic1 ), 250 );
};

--------------------
Ум заключается не только в знании, но и в умении прилагать знание на деле.Самое лучшее из всех доказательств есть опыт.Каждому человеку свойственно ошибаться, но никому, кроме глупца, несвойственно упорствовать в ошибке.
PM MAIL WWW ICQ Skype GTalk Jabber MSN   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: для новичков | Следующая тема »


 




[ Время генерации скрипта: 0.0766 ]   [ Использовано запросов: 22 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.