Dołącz do zespołu ekspertów! Backend lub Frontend Developer?

Sprawdź najnowsze oferty pracy naszego partnera - 8lines.io!

Jak zrobić wysuwany pionowy panel w nagłówku?

Szukam  Założony przez  VageX.

Chciałbym w nagłówku zrobić panel, który będzie się wysuwał pionowo. Będą w nim linki typu "Lista znajomych" "Wyloguj", itp. W wyszukiwarce Google znalazłem tylko poradniki o wysuwanych panelach z boku. Czy moglibyście mnie trochę pokierować, jak zrobić, żeby to się wysuwało w pionie?
*Wymagane zalogowanie się do konta testowego, ponieważ wysuwany panel ma być w nagłówku użytkowników.
http://www.kurshtml.edu.pl/skrypty/wygla...ijane.html
Cytat:w pół dnia stałeś się lepszym pytonistą niż kawenanowo kiedykolwiek programisto :3 ~ Riess 13.11.2018 16:28
Cytat:ale z tą nazwą to fyeem ma racje  ~ Divir 29.07.2019 16:08
To menu jest teraz tak namieszane, że szkoda komentować..
Tak na szybko, pobaw się jak chesz inaczej

CSS

/* Header */

.topnavigation {
 overflow: hidden;
 background-color: rgba(10,10,10,0.8);
}

.topnavigation a {
 float: left;
 display: block;
 color: #f2f2f2;
 text-align: center;
 padding: 14px 16px;
 text-decoration: none;
 font-size: 17px;
}

.topnavigation a:hover {
 background-color: #ddd;
 color: black;
}

.topnavigation .icon {
 display: none;
}

@media screen and (min-width: 0px) {
 .topnavigation a:not(:first-child) {display: none;}
 .topnavigation a.icon {
   float: right;
   display: block;
 }
}

@media screen and (min-width: 0px) {
 .topnavigation.responsive {position: relative;}
 .topnavigation.responsive .icon {
   position: absolute;
   right: 0;
   top: 0;
 }
 .topnavigation.responsive a {
   float: none;
   display: block;
   text-align: left;
 }

Następnie dodaj to do header

<div class="topnavigation" id="myTopnav">
   <a href="#">Menu</a>
 <a href="javascript:void(0);" style="font-size:15px;" class="icon" onclick="myFunction()">☰</a>
</div>
@Adrian16  i Twój sposób nie pomógł.
   
Problem rozwiązany. Kod zaczerpnąłem stąd: http://webkod.pl/kurs-css/lekcje/dzial-4...e-menu-css



Użytkownicy przeglądający ten wątek:

1 gości