首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >下拉菜单悬停时无延迟。"bootstrap4“

下拉菜单悬停时无延迟。"bootstrap4“
EN

Stack Overflow用户
提问于 2018-12-13 07:55:57
回答 1查看 275关注 0票数 0

无论我怎么尝试,我都不能让下拉菜单有延迟。主导航菜单的其余部分有一个很好的延迟。我添加了“css .dropdown-menu .delay(400)”,并尝试将"transition-duration: 800ms“添加到我能找到的每个css项中,但在下拉菜单上仍然没有延迟。其他人也有这种经历吗?https://rshweb.pro

bootstrap.mini.css:

代码语言:javascript
复制
.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 10rem;
  margin: .0rem .0rem;
  text-align: left;
  list-style: none;
  background-clip: padding-box;
  -webkit-transition-duration: 800ms;
  transition-duration: 800ms;
}
EN

回答 1

Stack Overflow用户

发布于 2018-12-13 08:58:54

一种可能的解决方案是使用不透明度和z索引来显示和隐藏菜单,例如,将以下内容添加到.dropdown-menu类中并从中移除display:none;属性

代码语言:javascript
复制
opacity: 0;
z-index: -10;

然后在悬停时,将以下内容添加到.dropdown:hover。下拉菜单

代码语言:javascript
复制
z-index: 10;
opacity: 1;

这只是一个快速修复,如果你使用bootstrap,你不应该需要这个,希望这能帮助你

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/53753159

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档