Форум

zemfira2108 · #1 (**permalink**) 08.10.2019, 07:53

Я прошёлся по многим сайтам и до сих пор не смог сделать код, нашел только небольшие части и то, которые значения не имеют к главной задаче, мне надо сделать фигуру, которая по концу таймера будет рандомно бегать по экрану, ну то есть, когда закончится время она рандомно будет менять свои координаты

рони · #2 (**permalink**) 08.10.2019, 09:39

zemfira2108,
где ваши попытки?

zemfira2108 · #3 (**permalink**) 08.10.2019, 09:52

Дак вот именно нет их, я только таймер смог сделать, а больше у меня ничего приближенного не получается

рони · #4 (**permalink**) 08.10.2019, 10:32

zemfira2108,

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  div{
      height: 100px;
      width: 100px;
      background-color: #FF00FF;
      border-radius: 50%;
      transition: 1.2s;
      transform: translate();
  }

  </style>
  <script>
   addEventListener('DOMContentLoaded', function() {
   const elem = document.querySelector('div'),
   size = [innerWidth - 100, innerHeight - 100],
   random = a => a * Math.random()|0,
   timer = () => {
       const [left, top] = size.map(random);
       elem.style.transform = `translate(${left}px, ${top}px`;
       setTimeout(timer, 1200)
   };
   timer()
     });
  </script>
</head>

<body>
<div></div>

</body>
</html>

zemfira2108 · #5 (**permalink**) 08.10.2019, 10:45

Спасибо большое, но чуть чуть не то, мне надо чтоб я нажал на фигуру и она убралась и появилась в рандомно месте экрана, но спасибо большое и за это, большое продвижение в деле

zemfira2108 · #6 (**permalink**) 08.10.2019, 10:46

Надеюсь, вы мне сможете ещё немного помочь, я вам буду очень благодарен

рони · #7 (**permalink**) 08.10.2019, 11:09

Сообщение от zemfira2108

я нажал на фигуру и она убралась и появилась в рандомно месте экрана

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  div{
      height: 100px;
      width: 100px;
      background-color: #FF00FF;
      border-radius: 50%;
      }

  </style>
  <script>
   addEventListener('DOMContentLoaded', function() {
   const elem = document.querySelector('div'),
   size = [innerWidth - 100, innerHeight - 100],
   random = a => a * Math.random()|0,
   timer = () => {
       const [left, top] = size.map(random);
       elem.style.transform = `translate(${left}px, ${top}px`;
   };
   elem.addEventListener('click', timer)
     });
  </script>
</head>

<body>
<div></div>

</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript