Szerző Téma: CSS legördülő menü  (Megtekintve 1595 alkalommal)

CSS legördülő menü
« Dátum: 2015. március 04. - 19:07:32 »
0 Show voters
nav#menu 
{
background-color: rgba(55,100,255, 1);
border-top: 1px solid rgba(7, 0, 0, 0);
font: 700 17px \"Arial\";
height: 33px;
padding: 5px;
width: 2000px;
z-index: 9999;
position: fixed;
top: 0px;
}
nav#menu ul {
    margin: 0 5px;
    list-style:none;
}
nav#menu ul li {
    float: top;
    margin-top: 2px;
    text-align:left;
    margin-right: 20%;
}
nav#menu ul li a {
    float: left;
    color: #ccc;
    text-shadow: 0 1px 0 #2B5356;
    padding: 5px 10px;
    text-decoration:none;
    text-align:left;
}
nav#menu ul li a ul li a{
    float: top;
    color: #ccc;
    text-shadow: 0 1px 0 #2B5356;
    padding: 5px 10px;
    text-decoration:none;
}
nav#menu ul li a:hover {
color: black;
background: #00FF7F;
}

 

<nav id=\"menu\">
<ul>
<li><a href=\"index.php\">Főoldal</a></li>
<li><a href=\"tortenet.php\">Történet</a></li>
<ul>
   <li><a href=\"#\">Text</a></li>
</ul>
<li><a href=\"asd.php\">asd</a></li>
        </ul>
</nav>

 
Azt szeretném megoldani, hogy a text a történet menüpont alatt jelenjen meg, ha a történet-re húzzuk az egeret. Tehát egy legördülő menüre lenne szükségem, aminek ugyan olyan a design-je, mint a menü-nek.
A css-be látszik, hogy próbálkoztam vele, de nem annyira sikerül. Aki tud segíteni, nagyon megköszönném :)

CSS legördülő menü
« Válasz #1 Dátum: 2015. március 04. - 19:54:36 »
0 Show voters
Cyrex, webdesigner foglalkozik HTML + CSS nyelvvel, ajánlom őt: cyrex.hu


Annyit tudok segíteni, hogy CSSben ha egy \'1\' nevű DIV-re ráhoverelsz és a \'2\' nevű DIV-et szeretnéd kezelni (jelenesetben megjeleníteni), akkor azt az \'1\' div utáni > operátor kihelyezésével teheted meg. Példa:
 

#1:hover > #2 {
    display: block;
    /* ..etc */
}

CSS legördülő menü
« Válasz #2 Dátum: 2015. március 04. - 20:45:40 »
0 Show voters
De jelen esetben ez nem 2 div, hanem 1...
És az ul részen belül van mégegy ul, ami a legördülő menü lenne.

Nem elérhető .:Secur:.

  • 2430
  • GTA Hero
    • Profil megtekintése
CSS legördülő menü
« Válasz #3 Dátum: 2015. március 05. - 14:46:31 »
0 Show voters
Adj egy id-t vagy egy class-t a 2. ul-nek.

CSS legördülő menü
« Válasz #4 Dátum: 2015. március 05. - 17:00:21 »
0 Show voters
Rendben, de a konkrét kódot, hogy alatta legyen és legördüljön ha ráhúzom az egeret meg tudná valaki írni? Mert mint már említettem próbáltam (igen, úgy is) de nem jött össze.

CSS legördülő menü
« Válasz #5 Dátum: 2015. március 05. - 19:15:24 »
+1 Show voters
Elég hosszú a CSS, de ez alapján szerintem tökéletesen meg lehet csinálni :)
http://cssdeck.com/labs/another-simple-css3-dropdown-menu

CSS legördülő menü
« Válasz #6 Dátum: 2015. március 06. - 18:38:34 »
0 Show voters
Kicseréltem a mostani design-t erre, és ment is. De sajnos nem tudom kombinálni a kettőt. Sehogy sem sikerül. Össze vissza csúszik az egész.
És mielőtt valaki kérdezné, tudom mi mit jelent (css-be) De nem sikerül megtalálnom a megfelelő kombinációt, hogy legördüljön, alá, és ne össze-vissza legyen.

CSS legördülő menü
« Válasz #7 Dátum: 2015. március 06. - 19:46:03 »
0 Show voters
clear: both;

 
segíthet :)

Nem elérhető anGeL

  • Adminisztrátor
  • 2158
    • Profil megtekintése
CSS legördülő menü
« Válasz #8 Dátum: 2015. március 21. - 15:10:49 »
+2 Show voters
[mod]Kérlek foglalkozz a témáddal![/mod]

 

SimplePortal 2.3.7 © 2008-2024, SimplePortal