«Единственный способ творить великие дела – это любить то, что ты делаешь»
JavaScript
site.komp36.ru Создание сайтов. Твой сайт фотографа Что есть на сайте? Несколько фото галерей: свадебная, постановочная съемка, love story, детские фото. Договор на фотосъемку, прайс-лист.
site.komp36.ru Продающий лендинг «Установка и продажа окон» Установка и продажа окон, установка дверей, перегородок. Одностраничный продающий сайт. Заявки прямо с сайта
site.komp36.ru Универсальный лендинг. Любая тема сайта - 4900 руб. Лендинг адаптируется под любую тему: ремонт, отделка, продажа окон, дверей, лестниц, мебели и многое другое
site.komp36.ru Создание сайтов. Сайт сервисного центра. Сайт компании. Новости и отзывы. Несколько прайс-листов – под каждый отдельная страница. Возможность размещения статей


Игра «Морской Бой» на JavaScript: Простая Игра и Игра для Двоих



Свойства onmouseover и onmouseout соответствуют событию наведения указателя мыши на объект (элемент веб-страницы) и событию выхода указателя за границы объекта.

Далее рассмотрим практический пример.

Для этого обратимся к предыдущей заметке с тремя полупрозрачными изображениями, где при помощи события щелчок мышью (свойство onclick) и метода setTimeout было сделано так, что при щелчке мышью на любом из 3-х изображений, оно из полупрозрачного состояния переходило в полноценное, а через заданный промежуток времени снова становилось размытым.

Здесь будет немного иное условие:

Итак, имеем три размытых изображения.

Используя события наведение указателя мыши на объект (свойство onmouseover) и выхода указателя за границы объекта (свойство onmouseout), реализовать задачу:

- при наведении указателя на любое из трех изображений, оно теряет размытость, и становится полноценным;

- при выходе указателя за границы картинки - оно снова становиться полупрозрачным.



Свойства onmouseover и onmouseout - Событие наведение мыши

Фрагмент кода

<script type="text/javascript">


window.onload = back_gr;


function back_gr(){

var images = document.getElementsByTagName('img'); /* Объект images содержит все изображения и работает как массив */

for(i = 0; i < images.length; i++){
images[i].onmouseover = change; /* Назначаем один обработчик change для всех изображений, при возникновении события наведения указателя мыши на любое из них. Для этого используем свойство onmouseover */
images[i].onmouseout = re_change; /* Аналогично назначаем один обработчик re_change для всех картинок, при возникновении события выхода указателя мыши за их границы. Для этого используем свойство onmouseout */
}
}

function change(eventObj){
var images_1 = eventObj.target; /* сообщаем, какой элемент, т.е. какое изображение сгенерировало событие наведение указателя */
images_1.src = "img/peng_" + images_1.id + ".gif" /* меняем src соответствующего изображения, тем самым делая его полноценным */
}

function re_change(eventObj){
var images_2 = eventObj.target; /* сообщаем, какой элемент, т.е. какое изображение сгенерировало событие выхода указателя за его пределы */
images_2.src = "img/peng_" + images_2.id + "_blur.gif" /* Делаем изображение размытым */
}


</script>

<body>

<img src="img/peng_96_blur.gif" id='96'>
<img src=
"img/peng_64_blur.gif" id='64'>
<img src=
"img/peng_32_blur.gif" id='32'>

</body>

Результат

Читайте также...

site.komp36.ruТвой сайт фотографа. Создание сайтов Что есть на сайте? Несколько фото галерей: свадебная, постановочная съемка, love story, детские фото. Договор на фотосъемку, прайс-лист.
site.komp36.ru Акция Как начать свое дело? Свой сайт «Укладка плитки» 9 000 руб. Лендинг адаптируется под любой вид отделочных работ, продажу товаров или услуг. Сайт поможет найти новых клиентов
site.komp36.ru Акция Продающий лендинг «Установка и продажа окон» 9 000 руб. Одностраничный продающий сайт. Установка и продажа окон, установка дверей, перегородок. Заявки прямо с сайта

Отзывы и комментарии:

Комментариев нет...

Оставить отзыв:

Ваше Имя:

Текст комментария:

Ответьте на вопрос:

Сколько дней в Високосном году?


События
Тематические публикации
site.komp36.ru Как начать свое дело? Свой сайт «Укладка плитки» 9 000 руб. Лендинг адаптируется под любой вид отделочных работ, продажу товаров или услуг. Сайт поможет найти новых клиентов
site.komp36.ru Продающий лендинг «Установка и продажа окон» 9 000 руб. Одностраничный продающий сайт. Установка и продажа окон, установка дверей, перегородок. Заявки прямо с сайта
Популярные заметки
Последние заметки