Menu solo en mobile Menu solo en mobile
Menu solo en mobile
Mostrando resultados del 1 al 4 de 4
  1. #1
    Menu solo en mobile
    Hola , tengo este code menu , y me gustaria que solo se muestre en mobil y ocultarlo para desktop

    Pero poniendo esto , se me sigue viendo
    #toggle{display:none}


    Alguna ayuda / idea ?


    Código HTML:
    <nav class="navi"> 
                <input type="checkbox" id="toggle" checked>   
                    <label for="toggle" class="button"></label>
                        <section class="menu">
                             <ul>
                                <li><a href="#" class="active">Home</a></li>
                                <li><a href="#">About</a></li>
                                <li><a href="#">Products</a></li>
                                <li><a href="#">Vacancies</a></li>
                                <li><a href="#">Contact</a></li>
                            </ul>
                        </section>
            </nav>
    
     [MENTION=16931]medi[/MENTION]a only screen and (max-width : 640px) {
            header {
                position: absolute;
                box-shadow: 0 0 5px #000;
            }
            nav li {
                text-align: center;
                width: 100%;
                padding: 5px 0;
                margin: 0;
                float: none;
            }
    
            .navi {
                width: 100%;
                text-align: center;
                margin: 0 auto;
            }
            
            /*Transition effect*/
    
            .navi .menu {
                padding: 36px;
                margin: 57px 10px 53px 49px;
                background: #fff;
                border: 1px solid #444;
                right: 0px;
                -webkit-box-shadow: 0px 3px 5px 0px rgba(50, 50, 50, 0.75);
                -moz-box-shadow:    0px 3px 5px 0px rgba(50, 50, 50, 0.75);
                box-shadow:         0px 3px 5px 0px rgba(50, 50, 50, 0.75);
                background: #eee;
                height: auto;
                position: relative;
                top: 10px;
                transition: top 0.5s ease-in-out; 
            }
    
            .navi input#toggle {
                display: none;
            }
    
            .navi input#toggle + label {
                display: block;
                width: 100%;
                height: 87px;
                background:url(menu.png) center right no-repeat  #fff;
                position: absolute;
                right: 0;
                top: auto;
                cursor: pointer;
                border-bottom: 1px solid #000;
                z-index: 10;
            }
    
            input#toggle:checked ~ .menu {
                top: -400px;
            }
    }

  2. #2
    Registro
    21-enero-2016
    Ubicación
    Buenos Aires / Barcelona
    Edad
    29
    Mensajes
    163
    Hola!

    Tendrias que agregar un media query...


    media screen and (max-width: 480px) {
    header{
    display:none;
    }
    }



    ****
    es Header o nav (segun sea tu html, lo que quieras esconder)

    y el 480px es una medida std...eso podes modificarlo a lo que quieras (pensa que una tablet debe ser 750 aprox)
    Citar Citar  

  3. #3
    .menu{display:none}
    Citar Citar  

  4. #4
    Intenta eso amigo:

    media screen and (max-width: 480px) {
    header{
    display:none;
    }
    }
    Citar Citar  

Temas similares

  1. One Click Remove Menu - elimina un menú con un solo clic
    Aunque no sé qué tan buena idea sea (no sé si pida confirmación), ahí os comparto un nuevo plugin que te permitirá eliminar menús de la zona de...
    Respuestas: 0
    Último mensaje: 13-dic-2016
  2. Menu responsive solo CSS
    Hola, pues como dice el titulo, busco un Menu responsive, a poder ser gratis por falta de $$ y que este solo en CSS... y si tiene que hacer alguna...
    Respuestas: 6
    Último mensaje: 11-oct-2014
  3. Compañia solo para publicidad mobile DUDA
    Sucede lo siguiente, Tengo un compañia que solo me da publicidad para mobile redirec. Ellos me dieron un link donde el cual yo tenia que enviar el...
    Respuestas: 0
    Último mensaje: 21-ago-2014
  4. Barra menu version mobile
    Buenas sobre el tema de la version movil de blogger me gustaria añadir el boton menu para que salieran labelsmenu 21802 <b section...
    Respuestas: 0
    Último mensaje: 19-ene-2014
  5. ¿Menú oculto solo para administradores?
    Hola, Queria saber si existe una opcion que en joomla la tenia y me iba muy bien que es por ejemplo en mi blog wordpress que tenga un submenu que...
    Respuestas: 3
    Último mensaje: 16-nov-2013

Normas de publicación

  • No puedes crear nuevos temas
  • No puedes responder mensajes
  • No puedes subir archivos adjuntos
  • No puedes editar tus mensajes
  •