Показать сообщение отдельно
  #5 (permalink)  
Старый 05.05.2021, 12:59
Новичок на форуме
Отправить личное сообщение для DenM Посмотреть профиль Найти все сообщения от DenM
 
Регистрация: 08.03.2021
Сообщений: 9

Да, речь шла о присвоении результата вызова функции
<p><button id="coords-show-mark">Кнопка с id=«coords-show-mark», сообщение появится под ней</button></p>

let elem = document.getElementById("coords-show-mark");

  function createMessageUnder(elem, html) {
    // создаём элемент, который будет содержать сообщение
    let message = document.createElement('div');
    // для стилей лучше было бы использовать css-класс здесь
    message.style.cssText = "position:absolute; color: red";

    // устанавливаем координаты элементу, не забываем про "px"!
    let coords = elem.getBoundingClientRect();

    message.style.left = coords.left + "px";
    message.style.top = coords.bottom + "px";

    message.innerHTML = html;

    return message;
  }

  // Использование:
  // добавим сообщение на страницу на 5 секунд
  elem.addEventListener('click', createMessageUnder(elem, 'Hello, world!'));
  //let message = createMessageUnder(elem, 'Hello, world!');
  document.body.append(message);
  setTimeout(() => message.remove(), 5000);
Ответить с цитированием