Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 17.02.2022, 13:51   #1
LevMark
Пользователь
 
Регистрация: 28.03.2021
Сообщений: 24
По умолчанию Движение по диагонали в html

Картинка движется по диагонали только до половина страницы,что нужно изменить, что бы она двигалась от одного угла экрана к другому.
Код:
<html>
<head>
<meta charset="UTF-8">
<title>Диагональ и круг</title> 
<style>
#Button1 { width: 200px; height: 30px; position: fixed; margin-left: -250px; margin-top: 230px; }
#Picture1 { width: 350px; height: 250px; margin-left: 400px; margin-top: 20px; } 
</style>
<body bgcolor="brown"> 
<p><input type = "button" id="diag" onclick="change1(this)" value = "Движение по диагонали"  >
<p><img src="black panther.jpg" hspace="10" width="250" height="300"   id="pic1" onclick="dvig1(this)" >
<script type='text/javascript'>
var diag1;
var X=0;
var Y=0;
var x=0;
var y=0;
var a=0;
var k=document.documentElement.clientWidth;
var p=document.documentElement.clientHeight;
k=300;
p=200;

var color = "gold";
function change1(but) {
if(but.style.background){
but.style.background="";
document.getElementById("diag").value="Движение по диагонали";
clearInterval(diag1);}
else{
but.style.background=color;
document.getElementById("diag").value="Стоп";
diag1=setInterval(function ondiag(){diag()},10);
}
}
function diag(){
if((x-500>= k)||(y-425>= p)){ 
X = -2;
Y = -2;}
else if((x <=0)||(y <-50)){
X =2;
Y = 2;
}
x += X;
y += Y;
var IMAGE = document.getElementById('pic1');
IMAGE.style.transform='translate('+x+'px,'+y+'px)';
}
</script>
</body>
</html>
Изображения
Тип файла: jpg black panther.jpg (110.8 Кб, 1 просмотров)
LevMark вне форума Ответить с цитированием
Старый 17.02.2022, 13:53   #2
ForenLi
Форумчанин
 
Регистрация: 02.06.2021
Сообщений: 515
По умолчанию

Использовать размеры страницы, а не конкретные цифры 500 и 425
ForenLi вне форума Ответить с цитированием
Старый 19.02.2022, 11:53   #3
LevMark
Пользователь
 
Регистрация: 28.03.2021
Сообщений: 24
По умолчанию

ForenLi, то есть я меняю
Код:
if((x-500>= k)||(y-425>= p))
на
Код:
 if((x-k>= k)||(y-p>= p))
ведь именно эти переменные у меня отвечают за размер страницы. В таком случае, картинка не доходит до края.

Последний раз редактировалось LevMark; 19.02.2022 в 12:16.
LevMark вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
написать программу Pascal. найти сумму побочной диагонали матрицы, умноженной на минимальный элемент главной диагонали Njr54321 Помощь студентам 5 15.05.2019 09:24
Функция: нахождения минимального элемента в диагонали матрицы, параллельной главной диагонали - C++ isych Помощь студентам 1 07.01.2018 09:48
c++ движение планеты в системе двойной звезды или движение трех тел anpolol Помощь студентам 4 10.06.2016 02:08
pascal или Delphi: массив A[n,n]. Если на главной диагонали нет отрицательных элементов, то элементы побочной диагонали - удвоить, Ману Помощь студентам 3 29.05.2014 18:00
Движение фигуры По диагонали Weyner Мультимедиа в Delphi 6 21.10.2010 15:10