鼠标上的自动子高度悬停在父级上-AutoChildHeightonMousehoveronParent

I am making some Custom DropDown lists and this works on mouse hover of css.

我正在制作一些自定义DropDown列表,这适用于css的鼠标悬停。

     
Select from List
     

        
Football
        
Cricket
        
Hockey
    

Here is my complete JSFiddle http://jsfiddle.net/ZX8AK/ with css

这是我完整的JSFiddle http://jsfiddle.net/ZX8AK/与css

Now the problem is when we mouse hover the list it immediately sets height:auto; while I want to smoothly set height:auto;

现在的问题是,当我们将鼠标悬停在列表上时,它会立即设置height:auto;而我想顺利设置高度:auto;

We don't know what it's height is going to be because its items will be added dynamically. I don't care if we can do it with JQuery or CSS. All I want is to set it's height auto smoothly.

我们不知道它的高度是多少,因为它的项目将动态添加。我不在乎我们是否可以使用JQuery或CSS。我想要的是将它的高度设置为自动平滑。

To check its animated height, we can set

要检查其动画高度,我们可以设置

.CusSelect:hover > ul
{
     height:100px;
}

but this is the problem, we dont know what its height is going to be, so keeping it to auto is necessary.

但这是问题所在,我们不知道它的高度是多少,因此将其保持为自动是必要的。

1 个解决方案