изменение картинки при наведении на блог div

Здесь все должно быть понятно. Для div’а paretndiv устанавливаем начальную прозрачность 0,5. Содержимое div’а textbox располагаем вертикально по центру.

Как видим у каждого из div’ов есть свой класс. Вот их мы и опишем дальше вот таким образом:P

по наступлении события onMouseOut, когда мышкаPуходит из div’а срабатывает функцияPPdown(this)

по наступлении события onMouseOver, когда мышка попадает на div срабатывает функция Pup(this)

Для каждого родительского div’а указываем вызов пользовательских JavaScript функций:

<div class="image"><img src="3.jpg"></div><div class="textbox">ЖК монитор</div>

<div class="paretndiv" onMouseOver="up(this)" onMouseOut="down(this)" id="item3">

<div class="image"><img src="2.jpg"></div><div class="textbox">Офисное кресло</div>

<div class="paretndiv" onMouseOver="up(this)" onMouseOut="down(this)" id="item2">

<div class="image"><img src="1.jpg"></div><div class="textbox">Чашка кофе</div>

<div class="paretndiv" onMouseOver="up(this)" onMouseOut="down(this)" id="item1">

<title>Изменение прозрачности DIV при наведении мыши.</title>

<meta http-equiv="content-type" content="text/html; charset=utf-8">

Итак, страница содержит 3 родительских div’a, внутри каждого еще по 2 div’a — один с картинкой, другой с текстом. Создает html файл с таким содержанием:.

От нечего делать решил изобразить такую штуку, чтобы при наведении мыши на DIV его прозрачность менялась. Для изменения прозрачности используется появившееся в CSS3 свойство прозрачности opacity. Сразу скажу, что в недобраузере IE это работать скорее всего не будет. В Chrome, FF, Opera — все работает.

Изменение прозрачности DIV при наведении мыши

Опубликовано автором

Изменение прозрачности DIV при наведении мыши.

Создание сайтов, веб-программирование, php, css, js, обзоры железок

Изменение прозрачности DIV при наведении мыши. | Блог Kumatoza