0

我有一个使用 Genesis 主题在 Wordpress 上构建的网站HERE。我最近实施了一个“粘性菜单”。该菜单在 Chrome、Opera 和 Firefox 中运行良好,但在 Safari 中存在奇怪的图形问题。向下滚动时,Safari 中的菜单会从屏幕左侧“飞入”,然后停留在适当的位置。它不会在向上滚动时执行此操作,只会向下滚动。

我浏览了几个论坛,并试图找到解决方案。看来这个问题可以在我的 JS 中解决,切换“窗口”和“文档”;然而,这在这种情况下不起作用。

这是我的 JS,仅供参考:

jQuery(document).ready(function($) {
var $filter = $('.nav-primary');
var $filterSpacer = $('<div />', {
    "class": "filter-drop-spacer",
    "height": $filter.outerHeight()
});


if ($filter.size())
{
    $(window).scroll(function ()
    {
        if (!$filter.hasClass('fix') && $(window).scrollTop() > $filter.offset().top && window.innerWidth > 768)
        {
            $filter.before($filterSpacer);
            $filter.addClass("fix");
        }
        else if ($filter.hasClass('fix')  && $(window).scrollTop() < $filterSpacer.offset().top)
        {
            $filter.removeClass("fix");
            $filterSpacer.remove();
        }
    });
}

});
4

1 回答 1

0

在另一个论坛上找到了这个问题的答案。问题在于 Safari 如何呈现我的过渡 CSS。删除了以下内容,一切正常:

-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out;

于 2015-05-26T13:27:22.853 回答