HTML | Изменить цвет фона с помощью свойства onmouseover

Опубликовано: 1 Марта, 2022

В этом посте работа события onmouseover показана путем изменения цвета абзаца путем наведения курсора мыши на определенный цвет.

Синтаксис:

document.bgColor = 'nameOfColor'

HTML code that will change the colour of the background when the mouse is moved over a particular colour. Background colour property specifies the background colour of an element.

<html>
  <p>
    <!-- when mouse is move over the colour name, colour change -->
    <a onmouseover="document.bgColor="greem"">Bright Green</a><br>
    <a onmouseover="document.bgColor="red"">Red</a><br>
    <a onmouseover="document.bgColor="magenta"">Magenta</a><br>
    <a onmouseover="document.bgColor="purple"">Purple</a><br>
    <a onmouseover="document.bgColor="blue"">Blue</a><br>
    <a onmouseover="document.bgColor="yellow"">Yellow</a><br>
    <a onmouseover="document.bgColor="black"">Black</a><br>
    <a onmouseover="document.bgColor="orange"">Orange</a><br>
  </p>
</html>

Выход:
Изначально цвет фона белый-

При наведении указателя мыши на цвет «Ярко-зеленый» -

При наведении курсора мыши на «Красный» цвет -

При наведении курсора мыши на «пурпурный» цвет -

При наведении курсора мыши на «фиолетовый» цвет -

При наведении курсора мыши на «синий» цвет -

При наведении курсора мыши на «черный» цвет -

При наведении курсора мыши на «оранжевый» цвет -

При наведении курсора мыши на «желтый» цвет-