Safari浏览器中的Bootstrap下拉菜单变形

时间:2019-12-05 05:35:02

标签: javascript css

我有一个全角下拉菜单,可以将鼠标悬停在上面。它在Firefox和Chrome中工作正常,但在野生动物园中则无法正常工作。以下是描述问题enter image description here

的屏幕截图

这是代码

jQuery('body').find('.navbar.navbar-default .container-fluid > .nav.navbar-nav').each( function() {
        var $windowWidth = jQuery(window).width();
        if($windowWidth > 767) {
            var $childCount = jQuery(this).children('li').length;
            var $myAccountLength = jQuery('.personal-information').length;
            if($myAccountLength > 0) {
                $childWidth = ($windowWidth / $childCount)-4;
            } else {
                $childWidth = ($windowWidth / $childCount)-0.5;
            }
            jQuery(this).children('li').css('width',$childWidth);
            var $dropdownContainer = jQuery(this).children('li.dropdown');
            $dropdownContainer.on('mouseover',function () {
                jQuery(this).addClass('open');
                if($windowWidth < 992) {
                    $dropdownMenuAnchorWidth = jQuery(this).find('.dropdown-toggle').width()/6;
                } else if(($windowWidth >= 992 ) && ($windowWidth < 1368)) {
                    $dropdownMenuAnchorWidth = jQuery(this).find('.dropdown-toggle').width()/9;
                } else {
                    $dropdownMenuAnchorWidth = jQuery(this).find('.dropdown-toggle').width()/12;
                }
                $dropdownMenuAnchorOffset = jQuery(this).find('.dropdown-toggle').offset().left - $dropdownMenuAnchorWidth + 25;
                jQuery(this).find('ul.dropdown-menu li').css('margin-left',$dropdownMenuAnchorOffset);
            });
            $dropdownContainer.on('mouseleave',function () {
                console.log("-----",jQuery(this).find(".dropdown-menu li"))
                jQuery(this).removeClass('open');
                jQuery(this).find(".dropdown-menu li").hide();
            });
        }
    });'```

0 个答案:

没有答案