Страницы: 1
На одной страничке нашел скрипт, с помощью которого картинка гуляет по документа, отражаясь от ее краев (типа пинг-понга). Сценарий написан для ослика. Попробовал прикрутить к лисенку, и ничего не получилось. Вот код, поможете?
SCRIPT LANGUAGE="JavaScript"
var name = navigator.appName;
var yPos;
var step = 1;
var delay = 30;
var height = 0;
var Hoffset = 0;
var Woffset = 0;
var yon = 0;
var xon = 0;
var pause = true;
var interval;
var xPos = 20;
function changePos()
{
if(name)
{
width = document.body.clientWidth;
height = document.body.clientHeight;
Hoffset = img.offsetHeight;
Woffset = img.offsetWidth;
img.style.left = xPos + document.body.scrollLeft;
img.style.top = yPos + document.body.scrollTop;
}
else
{
height = window.innerHeight;
width = window.innerWidth;
Hoffset = document.img.clip.height;
Woffset = document.img.clip.width;
document.img.pageY = yPos + window.pageYOffset;
document.img.pageX = xPos + window.pageXOffset;
}
if (yon)
{
yPos = yPos + step;
}
else
{
yPos = yPos - step;
}
if (yPos < 0)
{
yon = 1;
yPos = 0;
}
if (yPos >= (height - Hoffset))
{
yon = 0;
yPos = (height - Hoffset);
}
if (xon)
{
xPos = xPos + step;
}
else
{
xPos = xPos - step;
}
if (xPos < 0)
{
xon = 1;
xPos = 0;
}
if (xPos >= (width - Woffset))
{
xon = 0;
xPos = (width - Woffset);
}
}
function pauseResume()
{
if(pause)
{
clearInterval(interval);
pause = false;
}
else
{
interval = setInterval('changePos()',delay);
pause = true;
}
}
function start()
{
if(name == "Microsoft Internet Explorer")
{
name = true;
yPos = document.body.clientHeight;
}
else
{
name = false;
yPos = window.innerHeight;
}
interval = window.setInterval("changePos()",delay);
}
</script>
</head>
<body onLoad="start()">
<div id="img" style="position:absolute;">
<img src="cat.jpg" width="160" height="120" onMouseDown="pauseResume();">
</div>
Отсутствует
firecat
Я могу допустить, что ты создал 5 дубликатов этой темы случайно (мало ли, форум взглюкнул, или связь), но будь внимателнее...
Отсутствует
Я могу допустить, что ты создал 5 дубликатов этой темы случайно (мало ли, форум взглюкнул, или связь), но будь внимателнее..
У меня тоже сегодня ни искать, ни создавать темы не хотел, а когда заново зашёл на форум, то увидел 4 своих темы
Отсутствует
А вообще в каком-либо браузере это будет работать???
В ИЕ работает. Firefox "спотыкается" на этих строчках:
Даже если написать
Hoffset = document.getElementById("img").clip.height; Woffset = document.img.getElementById("img").width;
не может найти свойство clip.
Время настанет, время придет...
И лис кОнкурiентов на части порвет !!!
Отсутствует
firecat
Я могу допустить, что ты создал 5 дубликатов этой темы случайно (мало ли, форум взглюкнул, или связь), но будь внимателнее...
Здравствуйте!
Тут за меня ответили. Да, действительно форум глючил. Я нажимал на кнопку Отправить, а мне выдавало сообщение об ошибке. Я пробовал еще и еще раз. Поэтому так и получилось.
Код работает прекрасно в ослике, я же об этом написал. Мне интересно увидеть, как это портировать на FF.
Никто пока не может?
Отсутствует
Работает в Firefox. Скрещивать ужа с ежом (FF и IE) оставляю в качестве ДЗ.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>...</title> <style type="text/css"> body { color: black; background: white; margin: 0; padding: 0; } a { color: red; } #fly { position: absolute; top: 0; left: 0; } </style> <script type="text/javascript"> var f = d = false; var intx = false; var dx = dy = 5; window.onload = function () { f = document.getElementById('fly'); intx = setInterval('go()',100); } function go() { var x = f.offsetLeft + dx; var y = f.offsetTop + dy; if (x >= window.innerWidth - f.offsetWidth) { x = window.innerWidth - f.offsetWidth; dx = -dx; } if (y >= window.innerHeight - f.offsetHeight) { y = window.innerHeight - f.offsetHeight; dy = -dy; } if (x <= 0) { x = 0; dx = -dx; } if (y <= 0) { y = 0; dy = -dy; } f.style.left = x + 'px'; f.style.top = y + 'px'; } function SS() { if (intx) { clearInterval(intx); intx = false; } else { intx = setInterval('go()',100); } } </script> </head> <body> <div id="fly"><img src="http://forum.mozilla.ru/img/avatars/57.jpg" onclick="SS()"></div> </body> </html>
Isn't it ironic... don't you think? — Alanis Morissette
Отсутствует
Спасибо большое. Правда у меня не очень большой опыт скрещивания. попробую. но буду премного благодарен, если кто-то это сделает быстрее меня. все таки хочется увидеть, что нужно менять в моем коде. имхо, так быстрее пойму особенности браузеров.
Отсутствует
у меня нашлось время на ДЗ. И я сделал ЭТО! Но появились вопросики, которые напрямую не относятся может к FF
Изменений два
Добавил в функцию go()
function go() {
if(name == "Microsoft Internet Explorer")
{
var x = f.offsetLeft + dx;
var y = f.offsetTop + dy;
if (x >= document.body.clientWidth - f.offsetWidth)
{
x = document.body.clientWidth - f.offsetWidth;
dx = -dx;
}
if (y >= document.body.clientHeight - f.offsetHeight)
{
y = document.body.clientHeight - f.offsetHeight;
dy = -dy;
}
if (x <= 0) { x = 0; dx = -dx; }
if (y <= 0) { y = 0; dy = -dy; }
f.style.left = x + 'px';
f.style.top = y + 'px';
}
else
{
var x = f.offsetLeft + dx;
var y = f.offsetTop + dy;
if (x >= window.innerWidth - f.offsetWidth) {
x = window.innerWidth - f.offsetWidth;
dx = -dx;
}
if (y >= window.innerHeight - f.offsetHeight) {
y = window.innerHeight - f.offsetHeight;
dy = -dy;
}
if (x <= 0) { x = 0; dx = -dx; }
if (y <= 0) { y = 0; dy = -dy; }
f.style.left = x + 'px';
f.style.top = y + 'px';
} //else
} //end function
Запустил и удивился. Картинка стала бегать от левого края к правому по горизонтали.
Пошел на MSDN за справкой. Тут наткнулся на кое-что непереводимое (my English not very good) и удалил самую первую строчку кода
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
и все заработало!
Как вариант, можно наоборот к этой строчке добавить еще одну
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
Мне больше нравится первый вариант с удалением. Меньше текста набивать :-)
Вопрос - зачем они нужны эти строчки. Всегда без них обходился, а тут на такое интересное явление наткнулся.
Отсутствует
Вопрос - зачем они нужны эти строчки. Всегда без них обходился, а тут на такое интересное явление наткнулся.
За тем же, зачем в начале exe файла находится MZ. Это сигнатура файла. Служит для того, чтобы браузер знал, что загрузил и мог проверить на ошибки (DTD). Ее надо писать всегда, иначе могут и глюки пойти.
Black holes were created when the God divided by zero.
Отсутствует
LattyF
Ну, насчёт всегда, это слишком резко. Но знать, что это за строчки нужно.
Как это резко? А стандарты? А потом вы же жалуетесь, что сайты кривые…
Black holes were created when the God divided by zero.
Отсутствует
HTML - это язык, у которого есть свои правила, которых надо придерживаться.
Когда люди, например, пишут программу на C, они же пишут её по правилам, а не жалуются "Ой, я тут написал, пару строк выкинул, а компилятор не компилит. Какой плохой компилятор."
Do not meddle in the affairs of Wizards, for they are subtle and quick to anger.
Отсутствует
Ну сравнение с С немного хромает. Если там писать не по правилам, то компилируется. А если в html я пропущу эти строчки, то в 99.9 процентах страница загрузится. То есть это не правило, а просто рекомендация. Хотя может и важная.
Отсутствует
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
IE 6.0 ведет себя как 6. И лучше понимает стандарты
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
IE 6 ведет себя как пятерка. Незнаю почему. Поэтому лучше дописывать вторую строчку.
Отсутствует
IE 6 ведет себя как пятерка. Незнаю почему
Isn't it ironic... don't you think? — Alanis Morissette
Отсутствует
На самом деле,
часто предпочтительнее, из соображений обратной совместимости. 5.0 стоит у всех, кто пользуется Windows с каких-то версий 98 по 2000, и при этом ничего сам не обновлял, XP стоит не на каждой машине. Что до обновлений, известно, что подавляющее большинство пользователей ничего и никогда не обновляют и даже не настраивают, пока нужные программки хоть как-то работают. А кто в состоянии скачать новый браузер, мог скачать и Firefox, или Opera. Таким образом, приходим к совместимости как минимум от 5.0 версии. В режиме более строгого следования стандартам 6.0 будет больше отличаться от 5.0 и 5.5, так что больше вероятности, что придется отдельно адаптировать под 6.0, а отдельно под 5.0 и 5.5.
Отсутствует
В режиме более строгого следования стандартам 6.0 будет больше отличаться от 5.0 и 5.5, так что больше вероятности, что придется отдельно адаптировать под 6.0, а отдельно под 5.0 и 5.5.
Да здравствует IE! Теперь придется писать отдельную версию сайта не только под него, но еще и под каждую его версию. А то у верстальщиков работы мало. Пусть теперь под IE три версии сайта заколачивают.
Black holes were created when the God divided by zero.
Отсутствует
Страницы: 1