Ich bin wirklich auf diesem fest und könnte wirklich Hilfe verwenden. Also ich habe diesen Code:Navigationen mit Dropdowns
<nav>
<a class="opcion-1" title="Opcion 1" href="#">Quiénes somos</a>
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
<a class="opcion-2" title="Opcion 2" href="#">Nuestro trabajo</a>
<a class="opcion-3" title="Opcion 3" href="#">UNAC news</a>
<a class="opcion-4" title="Opcion 4" href="#">Cómo donar</a>
<a class="lupa" title="Opcion 5" href="#"></a>
</nav>
CSS
nav {
display: flex;
justify-content: space-between;
background-color: #ccc;
margin-top: 10px;
}
nav > a {
text-decoration: none;
color: black;
font-family: Gotham book;
text-align: center;
width: 20%;
border-right: 1px solid #b3b3b3;
padding-top: 15px;
padding-bottom: 15px;
}
nav > .lupa {
background-image: url("http://i.imgur.com/kXm05cw.png");
background-repeat: no-repeat;
background-position: center;
}
nav a.opcion-1:hover {
background-image: url(http://i.imgur.com/JnbTq5a.png);
}
nav > a:hover {
background-color: #FFB53A;
color: transparent;
background-repeat: no-repeat;
background-position: center;
}
Was ich brauche, ist für Link1
und die anderen fallen nach unten, wenn die Eltern a
ausgewählt ist. Diese werden dann herunterfallen und Text darin aufdecken. Ich muss in der Lage sein, sie auch anzupassen. Sie können sehen, was ich unten brauche.
Sie würden dann in einem jQuery Registerkarte Plugin oder einem anderen Tab Plugin vielleicht Bootstrap, dass Akkordeon setzen. http://jsfiddle.net/syahrasi/us8uc/ – JQluv
Ich kann nicht scheinen, den Code zu importieren. Das CSS und der Text sind in Ordnung, aber die Tabs ändern sich nicht. –
Können Sie einen Link – JQluv