鍍金池/ 問(wèn)答/Java  PHP  Python  C  HTML/ 鼠標(biāo)hover離開(kāi)了父元素位置，子元素就消失，但是父子元素間有空隙怎么辦,如圖

鼠標(biāo)hover離開(kāi)了父元素位置，子元素就消失，但是父子元素間有空隙怎么辦,如圖

clipboard.png

.app-main .main-header{
    position: relative;
    display: flex;
    height: 70px;
    background-color: #f5f5f7;
    box-sizing: border-box;
    border-bottom: 1px solid #cdd0d1;
    cursor: pointer;
}

.app-main .main-header .header-dialog{
    display: none;
    position: absolute;
    top: 80px;
    left: 45px;
    width: 120px;
    height: 135px;
    padding: 25px;
    background-color: #fff;
    box-sizing: border-box;
    z-index: 1000;
    box-shadow:1px 1px 5px 5px rgba(6, 15, 24, 0.1)
}


hoverFn()
function hoverFn(){
    $('.app-main .main-header .header-left').hover(function(){
        $('.app-main .main-header .header-dialog').fadeToggle();
    })
}
回答
編輯回答
兔寶寶

子元素用margin-top:負(fù)值移動(dòng)和父元素連接起就行了

2018年5月9日 10:52
編輯回答
紓惘

純css的話(huà)要不就在外面包裹一個(gè)透明div擴(kuò)大一下范圍，要不就往上移動(dòng)一點(diǎn)。?；蛘哂脗卧?/p> 

.app-main .main-header .header-dialog:before{
    display:block;
    content:''
    position:absolute;
    height: 10px;
    width:100%;
    top:-10px;
    left:0; 
}
2018年5月23日 09:48
編輯回答
安淺陌

這樣挺美觀的... 開(kāi)玩笑~都絕對(duì)定位了，為什么不網(wǎng)上挪挪呢？你的意思是鼠標(biāo)點(diǎn)不到創(chuàng)建XX是嗎;

2017年11月1日 10:26
編輯回答
墨小羽

這種情況一般都是設(shè)置個(gè)定時(shí)器，如300毫秒，這個(gè)時(shí)間足夠你移動(dòng)到下面了，300毫秒后判斷隱藏

2017年7月3日 02:37