BootStrap实现鼠标悬停下拉列表功能

2019-11-19 17:32:05

字体：大中小

来源：转载

供稿：网友

BootStrap实现鼠标悬停下拉列表功能，具体内容详情如下所示：

//最简单的鼠标悬停,实现下拉功能,应用bootstrap框架的知识,不会bootstrap自己百度怎么使用

 <html><head>    <meta charset="UTF-8">      <!-- 引入 Bootstrap -->   <link href="../css/bootstrap.min.css" rel="external nofollow" rel="stylesheet">     <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->    <script src="../libs/jquery-1.11.1.js"></script>    <script src="../js/bootstrap.min.js"></script>    <title></title>  </head>  <body><div class="dropdown" >      <span class="dropdown-toggle" data-toggle="dropdown" data-target="#" >触发器</span>       <ul class="dropdown-menu" >        <li>1</li>        <li>2</li>        <li>3</li>        <li>4</li>      </ul>    </div>    <script>      $(document).ready(function(){        $("span").hover(function(){//鼠标悬停触发事件        $(".dropdown-toggle").dropdown('toggle');        });      });    </script>  </body></html>

以上所述是小编给大家介绍的BootStrap实现鼠标悬停下拉列表功能，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对武林网网站的支持！

上一篇：Vue自定义指令拖拽功能示例

下一篇：javascript 判断当前浏览器版本并判断ie版本