چطور میتونم منوی dropdown ( دراپ‌ داون ) یا همون منوی کشویی در bootstrap ( بوت‌استرپ ) رو با هاور کردن نمایش بدم به جای اینکه با کلیک کردن این کار انجام بشه ؟

.navbar-nav > .dropdown:hover > .dropdown-menu {
  display: block;
  visibility: visible;
  opacity: 1;
}
.navbar-nav > .dropdown > .dropdown-menu {
  display: none;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0.2s, opacity 0.2s linear;
}

بعدش کد JavaScript (اگر نیاز بود) برای نسخه ۴ به پایین بوت استرپ منظورمه چون برای نسخه‌ های جدید بوت‌ استرپ (از نسخه 5 به بالا) فقط کافیه از CSS استفاده کنی و نیازی به JavaScript نیست اما اگه هنوز داری از نسخه 4 استفاده می‌کنی می‌تونی از این کد استفاده کنی:

document.querySelectorAll('.navbar .dropdown').forEach(function(dropdown){
  dropdown.addEventListener('mouseenter', function(){
  let dropdownMenu = this.querySelector('.dropdown-menu');
  dropdownMenu.classList.add('show');
});
dropdown.addEventListener('mouseleave', function(){
  let dropdownMenu = this.querySelector('.dropdown-menu');
  dropdownMenu.classList.remove('show');
});
});