CSS div元素使更大的悬停区域

我有一个div元素宽度100px和高度100px。在里面我有另一个元素宽度100px和高度80px的边框，我让悬停消失，但我需要它消失在父元素悬停，所以也在20px下面。我希望我的问题是清楚的^^CSS div元素使更大的悬停区域

父DIV：

.whilelist 
{ 
    display: block;  
    float: right; 
    width: 226px; 
    height: 210px; 
    margin-left: 5px; 
    margin-bottom: 10px; 
    border-style: solid; 
    border-width: 3px; 
    border-color: white; 
    padding-top: 3px; 
    padding-left: 3px; 
    padding-right: 3px; 
    text-align: center; 
} 

.whilelist:hover 
{   
    border-style: solid; 
    border-width: 3px; 
    border-color: #C0C0C0; 
}

而且里面：

.whilebilder 
{   
    width: 220px; 
    height: 180px; 
    border-style: solid; 
    border-width: 1px; 
    border-color: #C0C0C0; 
    padding-left: 2px; 
    padding-right: 2px; 
} 

.whilebilder:hover 
{   
    border-style: solid; 
    border-width: 1px; 
    border-color: white;  
}

来源

2013-10-31 Matthias Müller

你的问题会很多更清楚，如果它有你的企图或代码.. –

发表您的HTML和CSS代码 – Sudheer

_“我希望我的问题是明确的” _。我也希望那样。 – j08691

尝试在parent:hover的动作。有些人喜欢：

.whilelist:hover .whilebilder { 
    display: none; 
}

演示http://jsfiddle.net/ghpDb/3/

来源

2013-10-31 20:29:38 DaniP

消失=与背景使其不可见相同的颜色。我试过你的代码不工作 –

@MatthiasMüller查看本演示http://jsfiddle.net/ghpDb/3/ – DaniP

感谢它的作品:)我尝试了错误的方式之前 –

这里是jQuery来做到这一点。

$('.class1').mouseleave(function() { 
    $('#text-wrapper').hide(); 
}); 
$('.class1').mouseenter(function() { 
    $('#text-wrapper').show(); 
});

来源

2013-10-31 20:30:56 Damon

CSS div元素使更大的悬停区域

回答

相关问题