bootstrap的下拉组件需要点击click才能展示下拉列表，这在使用导航的时候很不方便因此有一个扩展的组件来解决这个问题。

在VS的Nuget中查询bootstrap-hover-dropdown即可发现该扩展。

在项目中引入该js并在需要自动展开的地方增加

data-hover="dropdown"

示例：

<a href="@nav.URL" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown">@nav.Name <span class="caret"></span></a>

注意，如在MVC中使用，该js默认的安装目录是在/Content/Script目录下

bootstrap中对dropdown使用hover代替click的更多相关文章

  1. bootstrap中的dropdown组件扩展hover事件

    bootstrap的下拉组件,需要点击click时,方可展示下拉列表.因此对于喜欢简单少操作的大家来说,点击一下多少带来不便,因此,引入hover监听,鼠标经过自动展示下拉框.其实在bootstrap ...

  2. Bootstrap中的dropdown、下拉选择框、dropdown-toggle

    注意:如果您想要单独引用该插件的功能,那么您需要引用 dropdown.js.可以引用 bootstrap.js 或压缩版的 bootstrap.min.js. <!DOCTYPE html&g ...

  3. Bootstrap中DropDown插件显示下拉列表，点击下拉列表区域，不会再自动关闭。

    目标: Bootstrap中DropDown插件显示下拉列表,点击下拉列表区域,不会再自动关闭. 参考:http://v3.bootcss.com/javascript/#dropdowns    / ...

  4. bootstrap中popover.js(弹出框)使用总结+案例

    bootstrap中popover.js(弹出框)使用总结+案例 *转载请注明出处: 作者:willingtolove: http://www.cnblogs.com/willingtolove/p/ ...

  5. 优化checkbox和radio，类似Bootstrap中的iCheck

    checkbox和radio浏览器默认的已经满足不了大众的审美需求,更不用说浏览器之间的差异化,取而代之,优化checkbox和radio的方法也随之诞生了. html结构:单选框为例,简单说明: 其 ...

  6. bootstrap中使用日历控件

    在bootstrap中使用日历控件可以参照以下资料: http://www.bootcss.com/p/bootstrap-datetimepicker/index.htm 以下是参照此资料自己做的一 ...

  7. bootstrap中table页面做省市区级联效果(级联库见前面级联编辑)(非select下拉框)

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  8. Bootstrap中的less基础

    在线编译 因为 less 的语法毕竟相对简单,所以一些在线工具可以很轻松的做到.比如 http://less.cnodejs.net http://www.ostools.net/less  一般都有 ...

  9. 57、Bootstrap中文文档

    给大家介绍一个前端框架让你从此写起前端代码与之先前相比如有神助般的效果拉就是Bootstrap. 一.Bootstrap的下载 Bootstrap,由Twitter的设计师Mark Otto和Jaco ...

随机推荐

  1. [转]RTH试用手记之“额外功能”

    年初,罗德与施瓦茨公司(Rohde & Schwarz)推出了第一款的手持示波器,从指标上看,该示波器打破了传统手持器功能简单.指标水平低.结构粗糙的印象,取而代之达到了主流台式数字示波器的性 ...

  2. c# .NET RSA结合AES加密服务端和客户端请求数据

    这几天空闲时间就想研究一下加密,环境是web程序,通过js请求后台返回数据,我想做的事js在发送请求前将数据加密,服务端收到后解密,待服务端处理完请求后,将处理结果加密返回给客户端,客户端在解密,于是 ...

  3. TypeScript白鹭引擎Egret防止按钮事件冒泡穿透

    this.addEventListener(egret.TouchEvent.TOUCH_BEGIN, (event) => { if (event.target!=this) return;/ ...

  4. CSS鼠标手势

    属性名:cursor 属性值(手势状态): auto  :  默认值.浏览器根据当前情况自动确定鼠标光标类型. all-scroll  : IE6.0  有上下左右四个箭头,中间有一个圆点的光标.用于 ...

  5. [.net]ConcurrentBag源码分析

    ConcurrentBag根据操作线程,对不同线程分配不同的队列进行数据操作.这样,每个队列只有一个线程在操作,不会发生并发问题.其内部实现运用了net4.0新加入的ThreadLocal线程本地存储 ...

  6. ASP.NET基于NPOI导出数据

    using System; using System.Collections; using System.Collections.Generic; using System.IO; using Sys ...

  7. php函数源代码 C编写 【持续更新】

    由于经常被抓取文章内容,在此附上博客文章网址:,偶尔会更新某些出错的数据或文字,建议到我博客地址 :  --> 点击这里 strlen() 获取字符串长度,成功则返回字符串 string 的长度 ...

  8. Nginx+keepalive 负载均衡

    1 规划和准备 两台相同配置的web 用途 IP MASTER 192.168.1.100 BACKUP 192.1681.101 2 安装 两台接入服务器分别安装NginX和keepalived: ...

  9. java使用Redis8--3.0集群

    Redis集群至少需要3个主节点 # cd /usr/redis 创建一个目录 # mkdir cluster # cd cluster 1.复制一个配置文件 # cp ../redis.conf 9 ...

  10. java使用Redis1--安装与简单使用

    环境: CentOS6.4,Redis3.0.3 一.Redis安装(需要安装gcc) 官网http://download.redis.io/releases/redis-3.0.3.tar.gz上下 ...