Повторный onclick

233

04 апреля 2022, 15:20

Если нажать на картинку, то она будет следовать за курсором. Но а как сделать так, чтобы при втором клике на картинку она бы уже отстала от курсора и стояла бы на том месте, на котором остановили, а при 3 клике она снова следовала за курсором и так далее.

Код:

<script language="JavaScript" type="text/javascript"> 
  ns4 = (document.layers) ? true : false 
  ie4 = (document.all) ? true : false 
 
  function init() { 
    if (ns4) { 
      document.captureEvents(Event.onmousemove); 
    } 
 
    document.onmousemove = mousemove; 
  } 
 
  function mousemove(event) { 
    var mouse_x = y = 0; 
    if (document.attachEvent != null) { 
      mouse_x = window.event.clientX; 
      mouse_y = window.event.clientY; 
    } else if (!document.attachEvent && document.addEventListener) { 
      mouse_x = event.clientX; 
      mouse_y = event.clientY; 
    } 
    status = "x = " + mouse_x + ", y = " + mouse_y; 
 
    document.getElementById('x1').style.left = mouse_x; 
    document.getElementById('x1').style.top = mouse_y; 
 
  } 
</script> 
 
<body> 
  <br> 
  <div id="x1" style="position:absolute;width:50%;height:50%;" onclick="init()"> 
    <img src="2.JPG" width="189"> 
  </div>

Answer 1

function init() {
  ...
  document.onmousemove = document.onmousemove? null : mousemove;
}

ns4 = (document.layers) ? true : false 
ie4 = (document.all) ? true : false 
 
function init() { 
  if (ns4) { 
    document.captureEvents(Event.onmousemove); 
  } 
 
  document.onmousemove = document.onmousemove? null : mousemove; 
} 
 
function mousemove(event) { 
  var mouse_x = 0; 
  var mouse_y = 0; 
  if (document.attachEvent != null) { 
    mouse_x = window.event.clientX; 
    mouse_y = window.event.clientY; 
  } else if (!document.attachEvent && document.addEventListener) { 
    mouse_x = event.clientX; 
    mouse_y = event.clientY; 
  } 
  //console.log("x = " + mouse_x + ", y = " + mouse_y); 
 
  document.getElementById('x1').style.left = mouse_x+"px"; 
  document.getElementById('x1').style.top = mouse_y+"px"; 
 
}

#x1 { 
  border: 1px solid black; 
  display: block; 
}

<br> 
<div id="x1" style="position:absolute;width:50%;height:50%;" onclick="init()"> 
  <img src="https://homepages.cae.wisc.edu/~ece533/images/airplane.png" width="189"> 
</div>

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

Подробнее о сайте site-vizitka-kiev.org.ua

ТОП-10

Все популярные вопросы

Отладка пока не достигнется значение

Есть огромный код Среди него нужно найти, когда (место в коде) значение одной из переменных-строк не станет равным "GV 7" из Visual Studio

107

Может кто-то поможет упростить код?

Дан квадрат его пересекают произвольным количеством прямых параллельных основанию, так, что делят на прямоугольникиНайти точки пересечения...

HTML

Смена фото в профиле пользователя

Я начинающий в разроботке сайтов, сечас я делаю личный кабинет пользователяУ меня возникла проблема с реализацией смены фото у пользователя

187

HTML

Стилизация Pandas DataFrame Multiindex

Каким образом стилизовать (раскрасить) значения DataFrame из одной части колоночного индекса на основании значений из другой части колоночного...

141