0

I'm using bootstrap and got stuck. The code below works on click. How can I remake it so it would work on hover? I'm a noob in jQuery..

$(document)
.on('click.bs.button.data-api', '[data-toggle^="button"]', function (e) {
  var $btn = $(e.target)
  if (!$btn.hasClass('btn')) $btn = $btn.closest('.btn')
  Plugin.call($btn, 'toggle')
  e.preventDefault()
})
.on('focus.bs.button.data-api blur.bs.button.data-api', '[data-toggle^="button"]', function (e) {
  $(e.target).closest('.btn').toggleClass('focus', /^focus(in)?$/.test(e.type))
})
}(jQuery);

p.s. It seems like the important string is '[data-toggle^="button"]', since deleting this ruins the functionality p.p.s. I've already read How to make twitter bootstrap menu dropdown on hover rather than click but it didn't help. I'd prefer not to ruin what I'v already done

Community
  • 1
  • 1
Smelis
  • 33
  • 7

2 Answers2

3

Easy solution, is to make CSS

.dropdown:hover .dropdown-menu {
    display: block;
 }
Miomir Dancevic
  • 6,726
  • 15
  • 74
  • 142
0

This works for me, as this triggers the right events in Bootstrap: dropdown.js v3.3.7

<script>
    $('ul.nav li.dropdown').hover(function () {
        $(this).find('.dropdown-toggle').dropdown('toggle');
    });
</script>
Christopher Dabu
  • 1
  • 1