单击链接后通过滚动引导Bootstrap Navi闪烁

Question

我有固定的顶部导航。 我在Bootstrap 3中有这个导航。在我的页面上，我有几个链接，其中包含svg映像。 通过将鼠标悬停在链接上，它开始上下移动。 当我单击这些链接时，我的页面会平滑向下滚动到特定位置。 但是，当我单击这些链接后尝试向下或向上滚动时，导航在chrome中开始闪烁。 但是，当我用鼠标单击页面上的任意位置时，它停止闪烁。

可能是什么问题，或者如何模拟页面上任何地方的mouseclick？

我试过了：

$('body').click();

但是它现在确实起作用了。

这是我的网站： http : //mival.de/examples/mival/index.html

当您单击黑色箭头并在镀铬页面之后滚动时，导航开始闪烁。

JS滚动

//jQuery to collapse the navbar on scroll
$(window).scroll(function() {
    if ($(".navbar").offset().top > 50) {
        $(".navbar-fixed-top").addClass("top-nav-collapse");
    } else {
        $(".navbar-fixed-top").removeClass("top-nav-collapse");
    }
});

//jQuery for page scrolling feature - requires jQuery Easing plugin
$(function() {
    $('a.page-scroll').bind('click', function(event) {
        var $anchor = $(this);
        $('html, body').stop().animate({
            scrollTop: $($anchor.attr('href')).offset().top
        }, 1500, 'easeInOutExpo');
        event.preventDefault();
        setTimeout(function() {
            $('#homeSection').click();
        }, 500);
    });

});

Answer 1

好的，找到解决方案。 刚刚在我的arrow：hover类中添加了以下内容：

 -webkit-perspective: 1000;
 -webkit-backface-visibility: hidden;

并不真正知道它在做什么，但是它有效！

PS：除此之外，我将我的translateY规则的度量标准从em更改为px。