OSX Safari 6.0.3 和 twitter 引导折叠插件答案

【问题标题】：OSX Safari 6.0.3 and twitter bootstrap collapse pluginOSX Safari 6.0.3 和 twitter 引导折叠插件
【发布时间】：2013-03-27 01:32:43
【问题描述】：

我正在努力让手风琴折叠容器在 OSX 10.8.3 上的 Safari 6.0.3 中工作

仅当存在浏览器历史记录时才会出现此问题（已访问域中的其他一些页面）。如果您清除历史记录然后重新加载页面，则手风琴正在工作???

到目前为止我拥有和测试过的内容： 1. 所有其他浏览器都可以正常工作，包括 Windows 浏览器和旧 OSX (Snow Leopard) 的 Safari 2. 在检查器中我注意到折叠后的元素设置为 height:40px 而不是 height:auto 像 Chrome 那样。

你有没有注意到这种奇怪的行为？

【问题讨论】：

我也有同样的问题。

标签： css twitter-bootstrap safari collapse

【解决方案1】：

我没有找到 safari 不当行为的原因，但想出了一个解决手风琴可折叠元素的方法。过渡效果是通过 jQuery slideUp 和 slideDown 实现的。它可能对某人有帮助。

    if (navigator.userAgent.indexOf('Safari') != -1 && navigator.userAgent.indexOf('Chrome') == -1) {

    if(navigator.userAgent.indexOf('Mac OS X') != -1 && navigator.userAgent.indexOf('Version/6.0.3') != -1){

        $('[data-toggle="collapse"]').attr('data-toggle', "safari-collapse");

        var collapsible_elements = $(".collapse").addClass('safari-collapse').removeClass('collapse').not('.in').hide();

        $('[data-toggle="safari-collapse"]').on('click', function(e){

            e.preventDefault();

            var target = $(this).attr('href');

            if( $(this).attr('data-parent') ){      // check if data-parent (accordion)
                $(target).parent().siblings().find('.safari-collapse').not(":hidden").slideUp();    
            }

            if($(target).is(":visible")){
                $(target).slideUp();
            }
            else{
                $(target).slideDown();
            }

        });

    }

}

【讨论】：