【问题标题】:Bootstrap 3, open Collapse element on hoverBootstrap 3,悬停时打开折叠元素
【发布时间】:2013-12-01 22:17:23
【问题描述】:

我正在尝试将一些代码从Bootstrap 2 转换为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)
});

看起来他们从v2 > v3 改变了很多东西,所以我不知道要改变什么。我找到了一个有点处理它的线程,但实际上并没有做我所追求的:

Bootstrap Collapse accordion on hover

基本上我需要在Collapse 中有x 个元素。当您将鼠标悬停在其中一个上时,它将打开它(而不必单击它)。然后,当您移过另一个时,它将关闭其他并打开新的。

感谢您的任何建议!

【问题讨论】:

    标签: twitter-bootstrap collapse


    【解决方案1】:

    我按如下方式编辑了脚本以使其工作

    $(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);
        })
    });
    

    【讨论】:

    • 当我第一次悬停时全部打开然后工作得很好。如何解决这个问题
    猜你喜欢
    • 2014-07-26
    • 2018-05-10
    • 2016-03-14
    • 2012-05-30
    • 2023-03-18
    • 1970-01-01
    • 1970-01-01
    • 2019-02-20
    • 2017-09-29
    相关资源
    最近更新 更多