jQuery $(window).scroll和Internet Explorer(8-9) [英] jQuery $(window).scroll and Internet Explorer (8-9)

问题描述

http://jsfiddle.net/CbL7W/滚动事件行为的示例.

我有一个可以在Chrome和Firefox中正常运行的脚本.

var stickyNavigationOffsetTop = $('.top-nav').offset().top;
var stickyNavigation = function () {
    var scrollTop = $(window).scrollTop();
    if (scrollTop > stickyNavigationOffsetTop) {
        $('.top-nav').css({ 'position': 'fixed', 'top': 0, 'left': 0, 'opacity': .8 });
    } else {
        $('.top-nav').css({ 'position': 'relative', 'opacity': 1 });
    }
};
stickyNavigation();
$(window).scroll(function () {
    stickyNavigation();
});

但是Internet Explorer有一个小问题: 在同一页面上，我有该脚本，并且具有指向隐藏div的脚本的链接，这种情况有时有时页面会完全滚动回到页面顶部，但是IE不会触发$(window).scroll. >

页面返回页首时的问题截图.

Chrome浏览器(确定): http://i.stack.imgur.com/6WJx7.jpg

IE(错误): http://i.stack.imgur.com/CXbKk.jpg

解决方案

我遇到了同样的问题，尽管我不满意，但我的解决方法是在显示/隐藏div时触发window.scroll事件. $(window).trigger('scroll');

http://jsfiddle.net/CbL7W/ example of scroll event behavior.

I have this script that is working correctly in both Chrome and Firefox.

var stickyNavigationOffsetTop = $('.top-nav').offset().top;
var stickyNavigation = function () {
    var scrollTop = $(window).scrollTop();
    if (scrollTop > stickyNavigationOffsetTop) {
        $('.top-nav').css({ 'position': 'fixed', 'top': 0, 'left': 0, 'opacity': .8 });
    } else {
        $('.top-nav').css({ 'position': 'relative', 'opacity': 1 });
    }
};
stickyNavigation();
$(window).scroll(function () {
    stickyNavigation();
});

But there is a little problem with Internet Explorer: On the same page I have that script I have a link with a script that hides a div, when this happens sometimes the page completely scrolls back to the top of the page, but IE is not firing $(window).scroll when that happens.

Screenshot of the issue when page goes back to top.

Chrome (OK): http://i.stack.imgur.com/6WJx7.jpg

IE (Wrong): http://i.stack.imgur.com/CXbKk.jpg

解决方案

I have the same issue, and as much as I dislike it, my work-around is to trigger the window.scroll event when I show/hide the div. $(window).trigger('scroll');

这篇关于jQuery $(window).scroll和Internet Explorer(8-9)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！