悬停在DIV上时显示内容 [英] Show content when hovering over DIV

问题描述

悬停在DIV上时是否可以显示内容？请参阅图片

Is it possible to show content when hovering over the DIV. See Image

当我将鼠标悬停在div上时，会发生转换，但是否有可能显示悬停div内的内容，即。图片等

When I hover over the div, the transition takes place, but is it possible to show content inside the hovering div, ie. Images etc

html：

<div class="flowingdown">

</div>

CSS3：

.flowingdown {
    width:1045px;
    background-image:url(images/vertical_cloth.png);
    height:50px;
    float:left;
    margin-top:2px;
    margin-bottom:2px;
    border-radius:0 0  55px 55px ;
    transition: height 1s;
    -webkit-transition: height 1s;


}

.flowingdown:hover {
    height:100px;
}

推荐答案

假设您有以下标记：

Assume you have the following markup:

<div id="parent">
    Some content
    <div id="hover-content">
        Only show this when hovering parent
    </div>
</div>

CSS：

#hover-content {
    display:none;
}
#parent:hover #hover-content {
    display:block;
}

这应该会有用。

不知道如何做转换，但至少要放置相同的选择器。

Not sure how you'd do it with transitions, but you'd have to put the same selector at least.

示例

这篇关于悬停在DIV上时显示内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！