HTML атрибут событий onmouseout

Значение и применение

Атрибут событий onmouseout позволяет задать срабатывание скрипта, когда указатель мыши перемещается за пределы элемента.

Поддержка браузерами

Спецификации: pointerevents, multipage

✓Поддерживается во всех основных браузерах с 2015 года.

Показать браузеры

ВсеКомпьютерыМобильные

Совместимостьapi.Element.mouseout_event

Возможность	Компьютеры					Мобильные
	ChromeChrome	EdgeEdge	FirefoxFirefox	OperaOpera	SafariSafari	Chrome AndroidChromeAndroid	Firefox for AndroidFirefoxAndroid	Opera AndroidOperaAndroid	Safari on iOSSafariiOS	Samsung BrowserSamsungAndroid	WebView AndroidWebViewAndroid	WebView on iOSWebViewiOS
mouseout event	✓1	✓12	✓6	✓≤12.1	✓1	✓18	✓6	✓≤12.1	✓1	✓1.0	✓4.4	✓1

✓поддерживается◐с ограниченияминет поддержки?нет данных≤31 — не позднее версии 31

Синтаксис

<element onmouseout = "script" >

Переход указателя на дочерний элемент тоже может вызвать mouseout. Событие всплывает; event.relatedTarget указывает новую цель. Для выхода за пределы элемента вместе с его потомками используйте mouseleave.

Примеры, попробуйте сами

Событие mouseout

Нажмите ▶. Переместите указатель за пределы элемента.

index.html

HTML

<img src="assets/shishka.jpg" alt="Shishka" width="47" height="105" id="event-target-1" />
<p>
  После того как вы уберете указатель мыши с изображения запустится скрипт, установленный на атрибут события
  <span class="att">onmouseout</span>, который вернёт первоначальные размеры изображения.
</p>

main.js

JavaScript

function rastiShishka(x) {
    x.style.height = '210px'
    x.style.width = '93px'
}

function normal(x) {
    x.style.height = '105px'
    x.style.width = '47px'
}
document.getElementById('event-target-1').addEventListener('mousemove', function () {
    rastiShishka(this)
})
document.getElementById('event-target-1').addEventListener('mouseout', function () {
    normal(this)
})

Отличия HTML 4.01 от HTML 5

Где возникает событие

Атрибут можно задавать HTML-элементам, но возникновение события зависит от взаимодействия и состояния элемента. Наличие обработчика само по себе не делает элемент фокусируемым, редактируемым или перетаскиваемым.