Jump to content

Search the Community

Showing results for tags 'menu multilevel'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Q&A Desenvolvimento
    • Perguntas e respostas rápidas
  • Desenvolvimento e Banco de Dados
    • HTML e CSS
    • Java
    • Javascript
    • .NET
    • PHP
    • Python
    • Ruby
    • Mobile
    • Ambientes de Desenvolvimento
    • Arquitetura e Métodos Ágeis
    • Banco de Dados
    • DevOps
    • Desenvolvimento de Games
    • E-Commerce e Pagamentos Online
    • SEO e Otimizações
    • WordPress
    • Algoritmos & Outras Tecnologias
  • Design e Produto
    • Fotografia
    • Photoshop
    • Design de interfaces e UX
    • Edição/Produção de Vídeos
    • Marketing Online
    • Desenho, Ilustração e 3D
  • Entretenimento e uso pessoal
    • Geral
    • Segurança & Malwares
    • Gadgets e wearable
    • Softwares e Apps
    • Entretenimento

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Google+


Hangouts


Skype


Twitter


deviantART


Github


Flickr


LinkedIn


Pinterest


Facebook


Site Pessoal


Localização


Interesses

Found 1 result

  1. Olá Colegas não achei o tópio para boostrap 4 por isso coloquei aqui, reparei que menu multilevel no modo small ou seja smart phone não funciona quando clica do no submenu por ele não funciona. Lembrando que é Bootstrape 4 <!DOCTYPE html> <html lang=""> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title></title> <!-- ( Bootstrap css )--> <link href="js/bootstrap/css/bootstrap.css" rel="stylesheet"> <!-- ( Bootstrap css )--> <link href="css/font-awesome.min.css" rel="stylesheet"> <!-- (css do MenuMultilevel) --> <link rel="stylesheet" href="css/bootstrap-dropdownhover.css"> </head> <style> .dropdown-submenu { position: relative; } .dropdown-submenu > .dropdown-menu { top: 0; left: 100%; /*margin-top: -6px;*/ margin-left: -1px; -webkit-border-radius: 0 6px 6px 6px; -moz-border-radius: 0 6px 6px; border-radius: 0 6px 6px 6px; } .dropdown-submenu:hover > .dropdown-menu { display: block; } .dropdown-submenu > a:after { display: block; content: " "; float: right; width: 0; height: 0; border: 5px solid transparent; border-right-width: 0; border-left-color: #ccc; margin-top: 5px; margin-right: -10px; } .dropdown-submenu:hover > a:after { border-left-color: #fff; } .dropdown-submenu.pull-left { float: none; } .dropdown-submenu.pull-left > .dropdown-menu { left: -100%; margin-left: 10px; -webkit-border-radius: 6px 0 6px 6px; -moz-border-radius: 6px 0 6px 6px; border-radius: 6px 0 6px 6px; } .bg-faded { background: #ccc; } </style> <body> <section class="test"> <header class="topo"> <div class="container"> <nav class="navbar navbar-toggleable-md navbar-light bg-faded" role="navigation"> <!-- data-target : faz a ligação do menu com o botão de expandir. data-toggle="collapse" : função de comprimir o menu responsivo. Classe : navbar-toggler responsável por deixar o menu responsivo. Classe: navbar-toggler-icon icones do menu responsivo --> <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo02" aria-controls="navbarTogglerDemo02" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <a class="navbar-brand" href="#">Empresa ou logo</a> <div class="collapse navbar-collapse" id="navbarTogglerDemo02"> <ul class="navbar-nav mr-auto mt-2 mt-md-0"> <li class="nav-item active"> <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a> </li> <li class="nav-item"> <a class="nav-link" href="#">Link</a> </li> <!-- (Submenu) --> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false"> Features </a> <ul class="dropdown-menu"> <a class="dropdown-item" href="#">Action</a> <a class="dropdown-item" href="#">Another action</a> <a class="dropdown-item" href="#">Something else here</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="#">Separated link</a> </ul> </li> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" href="http://example.com" id="supportedContentDropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">tese</a> <ul class="dropdown-menu" aria-labelledby="supportedContentDropdown"> <li class="dropdown-item" href="#"><a class="nav-link" href="#">Something else here</a></li> <li class="dropdown-item"><a class="nav-link" href="#">Something else here</a></li> <li class="dropdown-item"><a class="nav-link" href="#">Something else here</a></li> <li class="dropdown-item dropdown-submenu" href="#"> <a class="nav-link dropdown-toggle" href="#" data-toggle="dropdown" aria-haspopup="false" aria-expanded="true">Dropdown</a> <ul class="dropdown-menu" aria-labelledby="supportedContentDropdown"> <a class="dropdown-item" href="#">Action</a> <a class="dropdown-item" href="#">Action</a> <a class="dropdown-item" href="#">Action</a> <a class="dropdown-item" href="#">Action</a> <a class="dropdown-item" href="#">Action</a> <a class="dropdown-item" href="#">Action</a> <a class="dropdown-item" href="#">Action</a> <a class="dropdown-item" href="#">Another action</a> <a class="dropdown-item" href="#">Something else here</a> </ul> </li> </ul> </li> </ul> </div> </nav> </div> </header> </section> <!-- ( Jquery )--> <script src="js/jquery.js"></script> <!-- (Tether Bootstrap )--> <script src="js/bootstrap/js/tether.min.js"></script> <!-- ( Bootstrap )--> <script src="js/bootstrap/js/bootstrap.js"></script> <script> $(document).ready(function () { $('.dropdown-submenu a').on("click", function (e) { $(this).next('ul').toggle(); e.stopPropagation(); e.preventDefault(); }); }); </script> </body> </html>
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.