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. [Erlang21]Erlang性能分析工具eprof fporf的应用

    前段时间项目改代码突然cpu波动很大,排查了好久都没有找到原因,只能求助于性能测试工具 :   <<Erlang程序设计>>----Joe Armstorng[哈哈,登月第一人 ...

  2. 如何在CentOS 7中禁用IPv6

    最近,我的一位朋友问我该如何禁用IPv6.在搜索了一番之后,我找到了下面的方案.下面就是在我的CentOS 7 迷你服务器关闭IPv6的方法. 你可以用两个方法做到这个. 方法 1 编辑文件/etc/ ...

  3. centos 安装vmware 9.02 报 Failed to load module "pk-gtk-module" "canberra-gtk-module"

    http://www.linuxidc.com/Linux/2012-01/50944.htm 系统平台:RHEL6.1 X86 32bit 软件版本:VMware-Workstation-Full- ...

  4. c#设计模式之代理模式(Proxy Pattern)

    引言 代理这个词语,大家在现实世界已经频繁的接触过,例如火车站代理售票点,因为这些代理售票点的存在,我们不必要去火车站的售票处就可以查询或者取到火车票.代理点本身是没有能力生产车票的,我们在代理处享受 ...

  5. openstack kolla 部署---不同的节点采用不同的物理接口

    在 /etc/kolla/globals.yml 文件中删除 neutron_external_interface  tunnel_interface  api_interface  storage_ ...

  6. “全栈2019”Java异常第十四章:将异常输出到文本文件中

    难度 初级 学习时间 10分钟 适合人群 零基础 开发语言 Java 开发环境 JDK v11 IntelliJ IDEA v2018.3 文章原文链接 "全栈2019"Java异 ...

  7. 苹果笔记本调整 pycharm 字体大小的地方

    我想,对于习惯了使用windows版本 或者 乌班图版本 的pycharm 的人而言, mac版本调节字体的地方藏的实在是太坑爹了.

  8. by python3-XSStrike 测试XSS

    一.概述: XSStrike是一个Cross Site Scripting检测套件,配备四个手写解析器,一个智能有效载荷生成器,一个强大的模糊引擎和一个非常快速的爬虫. XSStrike不是像其他工具 ...

  9. 关于IPv4设置一些常见问题的解答

      问:为什么要填IP地址.网关.DNS? 如果是单部机拨号上网,是不需要填这些的.不填,或乱填,对上网都没有任何影响.但是在局域网上网(用路由器就属此环境),就一定要正确设置(手工填写或接受自动分配 ...

  10. javascript IE事件处理及跨浏览器事件处理程序

    一.javascript事件处理中 addEventListener/removeEventListener 用于绑定事件和解除事件,但大多用于chrome/火狐/IE9这些比较高级的浏览器中,IE8 ...