Question

我想添加一个下拉菜单，显示标题悬停的时间。

与IGN（http://www.ign.com/）极为相似，一旦向下滚动到顶部菜单，悬停标题会显示顶部菜单。

我的网站有一个固定的标题（http://www.gizorama.com/），所以每当标题悬停时，我都希望我们的菜单显示在它下方。

Answer 1

您需要首先创建一个隐藏position: fixed的{{1}}上方菜单。如果您使用的是jQuery，则可以使用以下内容来实现悬停动画。

display: none

Answer 2

因为它是wordpress，你已经有了jquery ..所以：

JS

<script>
jQuery(document).ready( function(){
    jQuery('#header, #navigation-wrapper').hover(function(){
        jQuery('#navigation-wrapper').addClass('show_menu');
        jQuery('#navigation-wrapper').parent().css({"padding-top":"151px"});
    }, function(){
        jQuery('#navigation-wrapper').removeClass('show_menu');
        jQuery('#navigation-wrapper').parent().css({"padding-top":"0"});
    });
});
</script>

和 CSS

<style>
.show_menu {
    position: fixed;
    top: -1px;
    z-index: 9;
    width: 905px;
}
</style>

Answer 3

<style>
#header:hover~#navigation-wrapper
{   
    margin: auto;
    position: fixed;
    top: 88px;
    width: 905px;
    z-index: 9999;
}
</style>

标题鼠标悬停上的Wordpress菜单

3 个答案: