Показать дочерний div при наведении мыши на родительский элемент - нужен javascript?

Ответ 1

JS не требуется.

.hidden {
  display: none;
}

.parent:hover .hidden {
  display: block;
}

<div class="parent">
  <p>Hello, I'm a child...</p>
  <p class="hidden">..and so am I but I'm hidden.</p>
</div>

Ответ 2

@jdln; да

CSS

.outer {
    background:red;
    height:100px;
}
.box1 {
    background:blue;
    height:100px;
    width:80px;
    display:none;
}
.outer:hover .box1{
    display:block;
    cursor:pointer;
}

проверьте скрипт: http://jsfiddle.net/sandeep/XLTV3/1/

Ответ 3

С jQuery абсолютно:

$("#some_parent").hover(function ()
{
    $(this).children("#some_child_div").show();
});

Ответ 4

Сначала я использовал css-решение выше, но мне пришлось использовать jQuery, потому что мой дочерний div содержал изображение, которое вызывало зависание. Здесь мы показываем дочерний элемент, зависающий над родителем (если размер экрана на рабочем столе), на мышином узле и скрываем его на мышином лебеде, но только если он теперь витает над контейнером главной страницы, чтобы минимизировать мерцание:

$(document).ready(function () {
    $(".parent-qtip").mouseenter(function () {
        if ($(window).width()>=1200)
            $(this).children(".child-qtip").show();
    });
    $(".parent-qtip").mouseleave(function () {
        if ($('.page-content').find('.container:hover').length)
            $('.child-qtip').hide();
    });
});

Ответ 5

Используя jQuery, вы можете добавить событие mouseover в родительский div и show дочерний div. См. эту скрипту в качестве примера.

Ответ 6

Поскольку это дочерний элемент, вам не нужен javascript. Вот пример .