Bootstrap 3, open element Collapse on hover

Question

I am trying to convert code from Bootstrap 2to Bootstrap 3:

$(document).on('mouseenter.collapse.data-api', '[data-toggle=collapse]', function(e) {
    var $this = $(this),
        href, target = $this.attr('data-target') || e.preventDefault() || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '') //strip for ie7
        ,
        option = $(target).data('collapse') ? 'show' : $this.data()
        $(target).collapse(option)
});

It looks like they changed quite a bit of things out v2 > v3, so I lost a bit of what to change. I found a thread that is associated with it, but doesn’t actually do what I need:

Bootstrap Collapse accordion on hover

Basically I need to have x elements in Collapse. When you hover over one of them, it will open it (instead of clicking it). Then, when you move on to another, he will close the rest and open a new one.

Thanks for any suggestions!

Answer 1

i script, ,

$(function() {
    $(document).on('mouseenter.collapse', '[data-toggle=collapse]', function(e) {
        var $this = $(this),
            href, target = $this.attr('data-target') || e.preventDefault() || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '')
            ,
            option = $(target).hasClass('in') ? 'hide' : "show";
            $('.panel-collapse').not(target).collapse("hide");
            $(target).collapse(option);
    })
});