Question

我是一名初级网站开发人员，我想要完成我的大学项目，但是在开始时因为我的导航div和导航div中的小div不会立即转换或转换。当我在绝对位置全部应用转换时（也将绝对位置应用于其他三个小div）除了第一个消失之外的所有三个em都消失。代码已链接。我想像 IMDB的导航一样进行导航。（有下行过渡，一端有链接和图片。）

- 提前谢谢。

HTML CODE：

<body>
<div id="Papadiv">

<header id="Header">

    <Div id="Logodiv">
    <img src="Images/Logo.jpg" height="100px" width="100px" />
    </Div>
<Div id="Titlediv">
<font size="+5" face="Comic Sans MS, cursive">MobilePassion.com</font> 

</Div>
</header>



<nav id="Nav1">
    <div id="navoption1">
    <a href="Index.html">
    New Arrivals</a>
    </div>
    <div id="navoption2">
    <a href="Famousmodels.html">
    Famous Models</a>
    </div>
    <div id="navoption3">
    <a href="Whoweare.html">
    Who We Are?</a>
    </div>
    <div id="navoption4">
    <a href="Contactus.html">
    Contact Us</a>
    </div>

</nav>



/* CSS Document */



#Nav1
{
background-color: #FDAA2F;
height:50px;
width:800px;

}

#navoption1
{
background-color:#FD771E;
height:10px;
width:160px;
border-radius:20px;
float: left;
color:#722703;
padding:20px;
text-align:center;



}


#navoption2
{
background-color:#FD771E;
height:10px;
width:160px;
border-radius:20px;
float: left;
color:#722703;
padding:20px;
text-align:center;



}


#navoption3
{
background-color:#FD771E;
height:10px;
width:160px;
border-radius:20px;
float: left;
color:#722703;
padding:20px;
text-align:center;

}


#navoption4
{
background-color:#FD771E;
height:10px;
width:160px;
border-radius:20px;
float: left;
color:#722703;
padding:20px;
text-align:center;





#navoption1:hover
{
color:#C13D04;
background-color: #F5530E;

animation:alternate;
text-decoration:blink;
background-image:url(Rose%20(1).jpg)
}

#navoption2:hover
{
color:#C13D04;
background-color: #F5530E;

animation:alternate;
text-decoration:blink
}
#navoption3:hover
{
color:#C13D04;
background-color: #F5530E;

animation:alternate;
text-decoration:blink
}
#navoption4:hover
{
color:#C13D04;
background-color: #F5530E;

animation:alternate;
text-decoration:blink
}

Answer 1

我认为首先你需要做一些关于如何构建一个＆＃34; CSS Mega下拉菜单的研究。（这通常就是他们所谓的，你应该能够找到一个很好的例子，你可以在其中构建你的造型。）

A＆＃34;经典＆＃34;下拉菜单通常包含在父列表项中嵌套（或在您的情况下为div）的列表。

＆＃34; Here＆＃34;是一个很好的一步一步的例子，我认为应该让你离开并运行。

Answer 2

我一直在寻找一个好的资源来举个例子。这些都是我认为可以学习的好例子。 http://code-tricks.com/simple-css-drop-down-menu/，http://css-tricks.com/simple-jquery-dropdowns/。用户体验使用hoverintent（http://cherne.net/brian/resources/jquery.hoverIntent.html）或延迟也是明智之举。这可以创造更好的用户体验。

需要Div管理方面的帮助

2 个答案: