onmouseover 2 события на одну функцию
Добрый день! Профессионалы! Кто нибудь может подсказать, как привязать 2 события к одной функции.
У меня при наведении на опр. div меняется картинка. Это работает. Мне нужно сделать, чтобы помимо смены картинки вылетел еще и доп. div с ссылками. Не могу раскурить как это сделать. Одно действие работает, а как 2 привязать не пойму. onmouseover не может же сразу 2 функции вызывать? Жаль... Вот кусок кода Сама функция для смены картинки function changeDiv(){ document.getElementById("item_1").style.background Image="url('../images/reel_home_bg_1_1.jpg')"; document.getElementById("item_1").style.background Size = "100% 580px"; document.getElementById("item_1").style.background Repeat="no-repeat"; } Вот нарыл в инете. А как объеденить не пойму function openBlock(el) { var kids = el.parentNode.childNodes; for (var k = 0; k < kids.length; k++) { var child = kids[k]; if (child && child.className == "this_block_is_hidden") { if (child.style.display != 'block') { child.style.display = 'block'; } else { child.style.display = 'none'; } } } } Всем спасибо за советы, критику и т.д) |
espltd,
html и Пожалуйста, отформатируйте свой код! Для этого его можно заключить в специальные теги: js/css/html и т.п., например: [js] ... ваш код... [/js] О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting. |
<div class="slider1">
<div class="sliderContent"> <div class="item"> <img src="<?php echo Yii::app()->request->baseUrl; ?>/images/reel_home_bg_0_1.jpg" width="100%" height="580px" /> <div id="item_1" class="ekran"></div> <div id="real_car"> <div id="real_car_1" class="real_car_1" onmouseover="changeDiv()" onmouseout="defaultDiv()"></div> </div> </div> </div> |
function changeDiv(){ document.getElementById("item_1").style.backgroundImage="url('../images/reel_home_bg_1_1.jpg')"; document.getElementById("item_1").style.backgroundSize = "100% 580px"; document.getElementById("item_1").style.backgroundRepeat="no-repeat"; } function openBlock(el) { var kids = el.parentNode.childNodes; for (var k = 0; k < kids.length; k++) { var child = kids[k]; if (child && child.className == "this_block_is_hidden") { if (child.style.display != 'block') { child.style.display = 'block'; } else { child.style.display = 'none'; } } } } Вот как мне сделать, чтобы при наведении на опр. div, вызывалось либо сразу 2 функции либо как то объединить. Есть в html 5 картинок, над каждой в position: absolute висит див, т.е. 5 дивов горизонтально. При наведении на любой див, картинка меняется. Это я сделал. работает. А как добавить, чтобы при смене картинки ещё и div дополнительный с ссылками выезжал. Спасибо. |
|
espltd,
может без скриптов ... <!DOCTYPE HTML> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style type="text/css"> .slider .item{ width: 100px; height: 100px; background: url(http://javascript.ru/forum/images/smilies/write.gif) } .slider:hover .item{ background: url(http://javascript.ru/forum/images/smilies/victory.gif) } .slider .real_car{ width: 100px; height: 0px; background: rgba(0, 255, 0, 1); transition: all 1s ease-in-out; } .slider:hover .real_car{ height: 100px; } </style> </head> <body> <div class="slider"> <div class="sliderContent"> <div class="item"></div> <div class="real_car"></div> </div> </div> </body> </html> |
Ребят, спасибо всем. Сейчас попробую и тот и тот метод, посмотрю какой лучше подойдет.
|
Часовой пояс GMT +3, время: 07:13. |