Изменение изображения при наведении мыши







Моя дорога в изучении HTML, PHP, CSS и MySQL

Украшаем сайт


7. Изменение изображения при наведении мыши

Когда-то с помощью редактора HTML-кода, по-моему, Dreamweaver я этот эффект применяла на школьном сайте (сейчас страница изменена), но тогда не заглядывала в коды. Взяла два изображения im-1.jpg, im-2.jpg одинакового размера. Поискала и нашла код для изменения изображения при наведении мыши:
<p><img src="images/im-1.jpg" width="300" height="212"
onmouseover="this.src='images/im-2.jpg'; this.width=300;this.height=212;"
onmouseout="this.src='images/im-1.jpg'; this.width=300;this.height=212;" alt="" /></p>

Код простой. Выравнивание в написанном коде не учитывается. Это нетрудно сделать с помощью CSS, когда потребуется. Но ведь где-то видела, как при наведении мыши изображение меняет размер. Получилось.

Ниже каждая буква заменяется изображением.








Copyright © 2015. Хайманова Татьяна Яковлевна. Все права защищены.