調整div懸停

我看到這個視頻，但它似乎不工作。我需要調整div高度from 200px to 250px然後在第一個裏面設置visibility: visible; div。 https://www.youtube.com/watch?v=Wb7TmUR5JJw 調整div懸停

它不適用於我有沒有沒有jQuery的選項嗎？

代碼：

#album:hover{ 

    height: 250px; 
    width: 250px; 
    transition: All 1s ease-in-out; 

}

來源

2016-04-23 Careless

有任何的代碼？ –

是的幾行沒有看到它沒有把代碼 – Careless

工作正常 - 請參閱此jsfiddle：https://jsfiddle.net/cmvmkjxt/3/ – nhouser9

你可以試試這個。懸停你的外部div將會更大，內部div會出現。爲了獲得更好的效果，請不要懸停在課堂上。

HTML

<div class="outer"> 
    <div class="inner"> 
    </div> 
</div>

CSS

div.outer { 
    width: 200px; 
    height: 200px; 
    background: orange; 
    transition: all 0.5s ease; 
} 
div.outer:hover { 
    width: 250px; 
    height: 250px; 
} 
div.inner { 
    height: 50px; 
    width: 50px; 
    background: red; 
    opacity: 0; //only for better effect 
    visibility: hidden; 
    transition: all 0.5s ease; 
} 
div.outer:hover .inner { 
    visibility: initial; 
    opacity: 1; 
}

來源

2017-02-17 07:43:30 Martin54

調整div懸停

回答

相關問題