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

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Линейное движение объекта(рисунка) 
:(
    Опции темы
Гость_eugene
Дата 20.9.2005, 12:54 (ссылка)    |    (голосов: 0) Загрузка ... Загрузка ... Быстрая цитата Цитата


Unregistered











В одном из учебников нашел следующий скрипт:

Код

<html>
<head>
  <title>Линейное движение объекта</title>
</head>
<body>
<img id="myimg" src="img/als.gif" STYLE="position:absolute; top:10; left:20">
<script language="javascript">
function init_move(){
dx=8//приращение по y
dy=3//приращение по x
setInterval("move()",200)//периодический вызов функции
move()
}
function move(){//изменение координат отображения
/*Текущие координаты*/
var y=parseInt(document.all.myimg.style.top)
var x=parseInt(document.all.myimg.style.left)
/*Новые координаты*/
[color=red]document.all.myimg.style.top=y+dy[/color]
document.all.myimg.style.left=x+dx
}
init_move()//Начинаем движение
</script>
</body>
</html>

Когда запускаю страницу IE6.0, то получаю следующее сообщение:

Недопустимый аргумент в строке 20(выделена красным цветом(см. выше))символ 1
. Где ошибка? Подскажите пожалуйста.
P.S. Сама картинка отображается, но она не перемещается. А должна бы...

Это сообщение отредактировал(а) Aliance - 20.9.2005, 13:40
  Вверх
Aliance
Дата 20.9.2005, 13:41 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


I ♥ <script>
****


Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

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



Пользуйся подсветкой правильно. Используй предпросмотр твоих сообщений.
И привыкай ставить точки с запятой в конце КАЖДОЙ строчки.
PM MAIL WWW ICQ Skype   Вверх
Sardar
Дата 21.9.2005, 00:19 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бегун
****


Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

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



Ну IE же говорит на какой строчке ошибка, осталось только посмотреть smile
Строчка 19:
Код
[color=red]document.all.myimg.style.top=y+dy[/color]

Ты нарочно BB теги поставил?

Замени все document.all на document.getElementById.


--------------------
 Опыт - сын ошибок трудных  © А. С. Пушкин
 Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
 Оценить мои качества можно тут.
PM   Вверх
Гость_eugene
Дата 21.9.2005, 05:45 (ссылка)    |    (голосов: 0) Загрузка ... Загрузка ... Быстрая цитата Цитата


Unregistered











Цитата(Sardar @ 21.9.2005, 00:19)
Замени все document.all на document.getElementById.

Заменил. Что-то типа такого:
Код

17.var y=parseInt(document.getElementById("myimg").style.top)
18.var x=parseInt(document.getElementById("myimg").style.left)
19.document.getElementById("myimg").style.top=y+dy
20.document.getElementById("myimg").style.left=x+dx

В итоге выдается ошибка строка 19: Недопустимый аргумент.
Может у что-то со строкой 6 не то? Дело в том, что как я не менял параметры left и top, на внешнем виде страницы это никак не отражалось.
Код

6.<img id="myimg" src="img/als.gif" STYLE="position:absolute; top:10; left:20">



 ! 
 

Еще раз повторяю: пользуйся подсветкой правильно!


Это сообщение отредактировал(а) Aliance - 21.9.2005, 14:44
  Вверх
Sardar
Дата 21.9.2005, 18:42 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бегун
****


Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

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



Цитата
В итоге выдается ошибка строка 19: Недопустимый аргумент.

Обмозгуй ошибку, вспомни про alert, узнаешь что присваиваешь ты полю NaN smile
Проблема в том, что при первом обращении к style.top|left ты получишь пустую строку, в итоге NaN. В ИЕ есть currentStyle и runtimeStyle, остальные в отстое по моему. Также читай лучше scrollTop и scrollLeft, сразу число, если слой на абсолютной позиции, то получишь координаты от document.documentElement.


--------------------
 Опыт - сын ошибок трудных  © А. С. Пушкин
 Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
 Оценить мои качества можно тут.
PM   Вверх
Throne
Дата 21.12.2006, 13:16 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


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

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



Тут воспользовался этим кодом, подправил, дополнил; кому интересно — посмотрите  smile 
Код

<html>
<head>
  <title>Совсем не линейное движение объекта</title>
</head>
<body>
<div id="myimg" STYLE="position:absolute; top:150; left:0;">
<img src="2.jpg" onmouseover="stop=1" border="0">
</div>
<script language="javascript" type="text/javascript">
var dx=10, dy=10, stop=0;
function timetomove(time){
setTimeout ("init_move()",time);
}
function init_move(){
document.all.myimg.style.left=-0;
setInterval ("move()",15);
}
function move(){
var y=parseInt(document.all.myimg.style.top);
var x=parseInt(document.all.myimg.style.left);
document.all.myimg.style.top=y+dy;
document.all.myimg.style.left=x+dx;
xp=parseInt(document.all.myimg.style.left);
yp=parseInt(document.all.myimg.style.top);
if (stop==1) {
dx=1;
dy=1;
}
if (xp > 153) {
dx=dx-1;
}
if (xp < -0) {
dx=dx+1;
}
if (yp > 150) {
dy=dy-1;
}
if (yp < 0) {
dy=dy+1;
}
}
timetomove(2500);
</script>
</body>
</html>


З.Ы. Вот тока не проверял на совместимость со всеми браузерами, если где-то выдает ошибку — скажите пожалуйста какую и как исправить. Заранее спасибо
--------------------
Компьютер — это наредкость тупая вещь, но считает с феноменальной скоростью. 
PM MAIL   Вверх
Aliance
Дата 21.12.2006, 13:47 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


I ♥ <script>
****


Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

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



Если вижу в скрипте document.all (с небольшим исключение) сразу же закрываю скрипт и никогда к нему не возвращаюсь. Когда вы уже научитесь писать кроссбраузерные скрипты?
PM MAIL WWW ICQ Skype   Вверх
AKS
Дата 21.12.2006, 15:28 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Участник форума
**


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

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



Похвастаюсь и я тем, как освоил скрипты из учебников (как тут удержаться, движение картинок на странице - любимое занятие smile ). 
Движение уже не линейное, а как у Throne, по окружности. Но, думаю, автору темы это пригодится.
Код

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
    "http://www.w3.org/TR/xhtml11/DTD/xhtml11-strict.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='ru'>
<head>
<title>test</title>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<style type='text/css'>
/*<![CDATA[*/
#test {
  position:absolute;
  top:0;
  left:200px;
  width:30px;
  height:30px;
  background-color:black;
}
/*]]>*/
</style>
</head>
<body>
    <div id='test' onmouseout='startMove()' onmouseover='stopMove()'></div>
<script type='text/javascript'>
/*<![CDATA[*/
var satellite = document.getElementById('test'),
    angle = 0, // стартовая позиция на воображаемой окружности
    step = 10, // шаг движения
    direction = -1, // по "часовой" или против
    orbit = parseInt(satellite.offsetLeft), // радиус окружности
    start_X = start_Y = orbit,
    pi = Math.PI/180,
    interval = 0;

setTimeout(startMove, 500);

function startMove() {
    interval = setInterval(move, 100);
}
function stopMove() {
    clearInterval(interval);
}
function move() {
    angle += step;
    if (angle >= 360)
        angle = 0;
    var x = start_X - (orbit * Math.sin(angle * pi) * direction),
        y = start_Y - orbit * Math.cos(angle * pi);
    satellite.style.left = x + 'px';
    satellite.style.top = y + 'px';
}
/*]]>*/
</script>
</body>
</html>

Замечание!!! Никогда не используйте глобальные переменные таким неразумным способом,  как в этом сценарии.
PM MAIL   Вверх
eee
Дата 18.5.2008, 17:13 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 66
Регистрация: 14.4.2008
Где: ХарьковCity

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



взял скрипт автора топа, немного переделал:
Код

<button onclick="init_move()">click2move</button>
<img id="myimg" src="logo.gif" STYLE="position:absolute; top:100; left:0">

Код

function init_move(){
    dx=1;//приращение по y
    setInterval("move()",10);//периодический вызов функции
    move();
}
function move(){//изменение координат отображения
/*Текущие координаты*/
    var x=parseInt(document.getElementById('myimg').style.left);
/*Новые координаты*/
    if (x<400) document.getElementById('myimg').style.left=x+dx;
}

т.е. при нажатии на кнопке, начинается горизонтальное движение пока не достигнет 400й координаты.

но тут возникла другая проблема, закинул этот скрипт в другой документ, который является у меня на странице является фреймом.
задача элементарная - все тоже самое, вместо кнопки - ссылка, а начальные координаты картинки за пределами экрана, и движение начинается при наведении на ссылку

Код

<table cellpadding="0" cellspacing="0" width="100%">
  <tr>
    <td align="center" width="20%"><a href="" class="x" onmouseover="init_move()">Статьи</a></td>
    <td align="center" width="20%"><a href="" class="x" id="imgs">Изображения</a></td>
    <td align="center" width="20%"><a href="" class="x" id="sft">Софт</a></td>
    <td align="center" width="20%"><a href="" class="x" id="bks">Книги</a></td>
    <td align="center" width="20%"><a href="" class="x" id="clg">Каталог</a></td>
  </tr>
</table>
<img id="myimg" src="logo.gif" STYLE="position:absolute; top:100; left:-180;">

скрипт же остался без изменений, но работать не хочет!подскажите?
PM MAIL WWW ICQ   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
Форум для вопросов, которые имеются в справочниках, но их поиск вызвал затруднения, или для разработчика требуется совет или просьба отыскать ошибку. Напоминаем: 1) чётко формулируйте вопрос, 2) приведите пример того, что уже сделано, 3) укажите явно, нужен работающий пример или подсказка о том, где найти информацию.
 
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: Общие вопросы | Следующая тема »


 




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


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

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