прямолинейное передвижение картинки
привет всем ребята!!дело в том что я учусь в 9 классе и изучаю программирование самостоятельно без никакой помоши!!!
но вот случилось так чтоб мне оч понадобтлось помощь профессионаолов!! я написал код для передвижения картинки при клике на клавишу влево(стрелку) картинка должна идти направо и при клике влево на лево!! скажу честно я оч старался но ничего не получилось может вы напишите этот код !!я вас оч прошу,но пока воот мой код:
<html>
<head>
function plus()
{
var pos2 = 0;
document.onkeydown=pos2++;
document.onkeyup=pos2--;
document.getElementById("PerSonag").style.left= pos2;
}
</script>
<body onKeyPress="plus()">
<div style = '{position: absolute; left: 5; top: 800;}' id="PerSonag">
<img src="pips6.gif">
</div>
</body>
</html>
очень надеюсь на вашу поддержку и помощ!!!;) |
Цитата:
В твоем коде много ошибок, а работа с событиями клавиатуры очень не простой момент в JavaScript, который требует некоторых знаний, которых, видимо, у тебя еще нет. Поэтому, если мы напишем за тебя решение твоей задачки, это не принесет тебе никакой пользы, так что учи дальше и разбирайся :-) |
Обработка событий с клавиатуры не самая простая задача в рамках JavaScript. В твоем коде много ошибок как в скрипте, так и в HTML, и я бы советовал для начала прочитать статьи на нашем сайте, и вообще статьи в интернете на эту тему. Решение вряд ли поможет тебе, но можешь попробовать разобраться:
<html>
<head>
<script type="text/javascript">
function move(e) {
// Кросс-браузерное получение объекта событие:
e = e || window.event;
// Получаем keyCode:
var keyCode = e.keyCode;
// Берем элемент:
var el= document.getElementById("PerSonag");
// Определяем нажатие клавиш "влево", "вверх"
// "вправо" и "вниз", коды клавиш 37, 38, 39, 40:
if (keyCode == 37) {
el.style.left = parseInt(el.style.left || 0) - 2;
} else if (keyCode == 38) {
el.style.top = parseInt(el.style.top || 0) - 2;
} else if (keyCode == 39) {
el.style.left = parseInt(el.style.left || 0) + 2;
} else if (keyCode == 40) {
el.style.top = parseInt(el.style.top || 0) + 2;
} else {
// Если нажаты другие клавиши: выходим
return;
}
// Отменяем действие по умолчанию:
e.preventDefault(); // Gecko, ...
e.returnValue = false; // IE
}
// Устанавливаем обработчик на весь документ:
document.onkeydown = move;
</script>
</head>
<body>
<div style="position: absolute; left: 0; top: 0;" id="PerSonag">
<img src="pips6.gif">
</div>
</body>
</html>
|
спасиб друзья!!
я очень рад что вы мне постарались и лдаже оч много помогли!!
я прочитал около 4 книг по яве!!!!! мой мозг устал от такой нагрузки!! вот почему я попросил вашей помощи!спасибо огромное за советы и подсказки! |
,,,
дорогие друзья!!!
по вашему совету я скачал учебник классный и начинаю читать!!!!! спасибо за советы!! Я ПОЙДУ ЧИТАТЬ!! |
Про изучение русского языка только не забывай.
|
Еще вариант!
<html>
<head>
<script type="text/javascript">
function fn1(evt) {
var var1 = document.getElementById("img1"); //Ссылка на объект
var1.style.position = "absolute"; // Задаем абсолютное позиционирование
var x = var1.offsetLeft; //Определяем координату отступа (по оси x) от родительского элемента
switch(evt.keyCode) { //Объект события, определяющий какая клавиша нажата (В системе Unicode)
case 37: //Код клавиши со стрелкой влево (В системе Unicode)
x--; //Сдвиг на 1 пиксел влево
var1.style.left = x; //Новое значение координаты
break;
case 39: //Код клавиши со стрелкой вправо (В системе Unicode)
x++; //Сдвиг на 1 пиксел вправо
var1.style.left = x; //Новое значение координаты
break;
}
}
</script>
</head>
<body onkeydown="fn1(event)" onkeypress="fn1(event)" onkeyup="fn1(event)">
<div id="img1">
<img src="img.gif" />
</div>
</body>
</html>
|
спасиб те за твой варант!!!!!!
огромное спасибо! |
во всех вариантах не дописано, что это пиксели.
var1.style.left = x+'px' el.style.left = parseInt(el.style.left || 0) + 2+'px'; Все таки изменяются значения css |
Параллельно возник вопрос, во всех браузерах кроме оперы скрипты отрабатывают нормально. Вот только если везде зажать и держать клавишу то объект будет перемещаться все время, в опере приходится клавишу отжимать и нажимать заново, как это обойти!?
|
| Часовой пояс GMT +3, время: 22:20. |