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, время: 21:15. |