zoukankan      html  css  js  c++  java
  • bootstrap垂直下拉菜单默认展开

    HTML:

    <div class="col-md-3">

      <nav class="navbar">

        <div class="container-fluid">

          <div class="navbar-header common-border-bottom common-border-right common-border-left">

                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"

            data-target="#bs-example-navbar-collapse-1" aria-expanded="false">     

              <span class="sr-only"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span>

            </button>

          </div>

          <div class="collapse navbar-collapse common-border-right common-border-bottom common-border-left" id="bs-example-navbar-collapse-1">

            <ul class="nav nav-stacked navbar-nav">

              <li class="dropdown open input-interval">

               <a class="dropdown-toggle" data-toggle="dropdown">人生无常<b class="caret"></b></a>

                 <ul class="dropdown-menu">

                   <li><a href="#">人性凉薄</a></li>

                   <li><a href="#">看透了然</a></li>

                 </ul>

              </li>

            </ul>

          </div>

        </div>

      </nav>

    </div>

    由于加了open 所以默认是展开的,但是有个问题就是无论点击网页的任何地方都会折叠。以下的js解决了这个问题

    JS:

    <script>

      $(function () {

        var openddt = $(".open").children('.dropdown-toggle');

        openddt.attr('data-toggle', '');

        openddt.click(function () {

          $(this).siblings(".dropdown-menu").toggle();

        });

      })

    </script>

  • 相关阅读:
    chrome headless+selenium+python+(ubuntu 16.04/centos7) 下的实现
    selenium + phantomJS 常用方法总结
    Rabbitmq consumer端超时报错
    python 守护进程
    如何在GitBook中使用Git管理
    Java#Spring框架下注解解析
    Linux 之Ubuntu在VM中安装(桌面版)
    Linux----Ubuntu虚拟机(VMWare)学习
    Python tuple元组学习
    Python 编解码
  • 原文地址:https://www.cnblogs.com/Man-Dream-Necessary/p/5497999.html
Copyright © 2011-2022 走看看