bootstrap-hover-dropdown.js

Question

使用bootstrap框架，想把下拉菜单弄成渐显渐隐 要怎么改呢 ？

(function($, window, undefined) {

    var $allDropdowns = $();


    $.fn.dropdownHover = function(options) {


        $allDropdowns = $allDropdowns.add(this.parent());

        return this.each(function() {
            var $this = $(this).parent(),
                defaults = {
                    delay: 300,
                    instantlyCloseOthers: true
                },
                data = {
                    delay: $(this).data('delay'),
                    instantlyCloseOthers: $(this).data('close-others')
                },
                options = $.extend(true, {}, defaults, options, data),
                timeout;

            $this.hover(function() {
                if(options.instantlyCloseOthers === true)
                    $allDropdowns.removeClass('open');

                window.clearTimeout(timeout);
                $(this).addClass('open');

            }, function() {
                timeout = window.setTimeout(function() {
                    $this.removeClass('open');
                }, options.delay);
            });
        });
    };

    $('[data-hover="dropdown"]').dropdownHover();
})(jQuery, this);

Answer 1

不知道你这个问题是否已经解决, 如果还没有解决的话:

• 这篇文章：Bootstrap中的Dropdown下拉菜单更改为悬停(hover)触发 也许有你想要的答案，你可以看看

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^