搜索
热搜
活动 交友 discuz
发新帖
返回列表
查看 547
回复 0
Bootstrap 5 Dropdown组件扩展hover事件 精简版
复制链接
逆风天

16

主题

0

回帖

105

积分
超级版主
积分105
发消息
发表于 2024-1-30 15:58:50
显示全部楼层 阅读模式
本帖最后由 逆风天 于 2024-1-30 16:01 编辑
Bootstrap 5 Dropdown组件扩展hover事件

经过研究，有更精简简单的扩展办法，如下：
  1. const getDropdown = document.querySelectorAll('[data-bs-dropdown="hover"]');
  2. if (getDropdown.length > 0) {
  3.   getDropdown.forEach(function (Item) {
  4.     let ThisEl = new bootstrap.Dropdown(Item);
  5.     Item.addEventListener('mouseenter', function () {
  6.       ThisEl.show();
  7.     })
  8.     Item.parentNode.addEventListener('mouseleave', function () {
  9.       setTimeout(() => {
  10.         ThisEl.hide();
  11.       }, 300);
  12.     })
  13.   })
  14. }
复制代码


要求不高的话，可以使用这个方法
# 点我查看 #

回复
举报
发新帖
返回列表
高级模式
您需要登录后才可以回帖 登录 立即注册
本版积分规则
QQ 快速回复 返回列表