Question

我正在尝试创建一个在事件中移动到顶部的菜单（例如我使用悬停，我知道它没有意义）。

我正在使用calc（），因为我想不出更好的方法来做到这一点。问题是转换不适用于auto所以我必须给Top一个特定的值。如果我使用100%，菜单会溢出页面。

有没有更好的方法来移动没有calc（）的div？

感谢您的帮助。

<head>
    <style type="text/css">
        #header
        {
            width:100%;
            height:100%;
            position:absolute;
        }
        #header:hover ~ #menu
        {
            top:0;
        }
        #menu
        {
            position:absolute;
            bottom:0;
            top: 90%; /*fallback*/
            top: calc(100% - 100px);
            width: 100%;
            height:100px;
            transition: all 0.6s ease;
        }
    </style>
</head>
<body>
    <div id="header"></div>
    <div id="menu"></div>
</body>

从顶部到底部过渡时替换为calc（）

0 个答案: