javascript - Mozilla Firefox 中的 CSS/JS 问题

Question

我在 Firefox 中遇到了一个奇怪的问题。我已将一些 js 应用到该网站的标题 http://devignstudios.nl/因此，当用户向下滚动页面时，标题始终是粘性的。粘性 header 在除 Firefox 之外的所有浏览器中都可以正常工作。我试图找到解决方案，但找不到合适的答案。

下面是js

var stickyNavTop = $('#header').offset().top;
            var stickyNav = function(){  
            var scrollTop = $(window).scrollTop();  

            if (scrollTop > stickyNavTop) {   
                $('#header').addClass('sticky');  
            } else {  
                $('#header').removeClass('sticky');   
            }  
            };  

            stickyNav();  

            $(window).scroll(function() {  
                stickyNav();  
            });  

我们将不胜感激任何帮助。

提前致谢!

Answer 1

它与 scrollTop 函数有关，当应用于 id 和类时，该函数在 firefox 上并非在所有情况下都有效。试试这个:http://jsfiddle.net/rHmAA/7/

这是你的粘性 div 东西的修改版本。 (备查)该脚本使用#stickyheader 作为包装器。

$(document).ready(function () {
$('a[href^="#"]').bind('click.smoothscroll', function (e) {
    e.preventDefault();

    var target = this.hash,
        $target = $(target);

    var offset;
    if ($('#stickyheader').css('position') == 'relative') {
        offset = $('#stickyheader').outerHeight(true) * 2;
    } else {
        offset = $('#stickyheader').outerHeight(true);
    }
    console.log("offset: " + offset);
    var $parent = $target.offsetParent();
    console.log("$target.offset().top " + $target.offset().top);

    $('#wrapper').animate({
        'scrollTop': $target.offset().top - offset
    }, 1500, function(){
        window.location.hash = target;
    });

});

});