Jump to content

Search the Community

Showing results for tags 'css menu static convert hover'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • W3Schools
    • General
    • Suggestions
    • Critiques
  • HTML Forums
    • HTML/XHTML
    • CSS
  • Browser Scripting
    • JavaScript
    • VBScript
  • Server Scripting
    • Web Servers
    • Version Control
    • SQL
    • ASP
    • PHP
    • .NET
    • ColdFusion
    • Java/JSP/J2EE
    • CGI
  • XML Forums
    • XML
    • XSLT/XSL-FO
    • Schema
    • Web Services
  • Multimedia
    • Multimedia
    • FLASH

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests


Languages

Found 1 result

  1. I'm working on a rwd site from a template that has a static menu, but i can't figure out how to "convert" it to a cascade "hoverable" style menu. Any help would be very appreciated. this is the CSS code im working with: (I manage to hide the sublinks but can´t make them reappear) #menu-bar { display: none;}header label { float: right; font-size: 25px; margin: -62px 0; cursor: pointer;}.menu { position: absolute; top:106px ; left:0; width: 100%; height: 100vh; background:rgba(50,51,50,0.9); transition: all 0.5s; transform:translateX(-100%); }.menu a { display:block; color: #fff; height: 50px; text-decoration: none; padding: 15px; border-bottom: 1px solid rgba(255,255,255,0.5);}.menu a:hover { background:rgba(255,255,255,0.3); }#menu-bar:checked ~ .menu { transform: translateX(0%);}nav ul ul { display: none;} nav ul li:hover > ul { display: block; }@media (min-width:1024px) { .menu { position: static; width: auto; height: auto; transform:translateX(0%); float: right; display: flex; } .menu a { border: none; } header label { display: none; } } And this is the HTML code: (its for a spanish website) <nav class="menu"> <a href="INICIO.html">Inicio</a> <a href="NUESTRA_EMPRESA.html">Nuestra Empresa</a> <a href="PROYECTOS.html">Proyectos</a> <ul> <a href="SERVICIOS.html">Servicios</a> <ul> <li> <a href="#">instalaciones</a> <ul> <li><a href="#">eléctricas</a></li> <li><a href="#">mecánicas</a></li> </ul> </li> </ul> <ul> <li> <a href="#">estudios</a> <ul> <li><a href="#">termograficos</a></li> <li><a href="#">calidad de energia</a></li> </ul> </li> </ul> </ul> <a href="CONTACTO.html">Contacto</a> </nav> Thanks in advance.
×
×
  • Create New...