How do I tell IE to add the class 'Selected' to my LI on scroll?
I was hoping to get a little help with my code开发者_高级运维. This works in moz/webkit but not in ie. I don't quite understand why :(
$(window).trigger('hashchange');
// Add .selected class to nav on page scroll
var $sections = $('section');
var $navs = $('nav > ul > li');
var topsArray = $sections.map(function() {
return $(this).position().top - 50;
}).get();
var len = topsArray.length;
var currentIndex = 0;
var getCurrent = function( top ) {
for( var i = 0; i < len; i++ ) {
if( top > topsArray[i] && topsArray[i+1] && top < topsArray[i+1] ) {
return i;
}
}
};
$(document).scroll(function(e) {
var scrollTop = $(this).scrollTop();
var secondSection = topsArray[1];
if(scrollTop <= 200) { // moved past the header
$navs.eq(0).removeClass("selected")
} else if(scrollTop >= 205 && scrollTop <= secondSection ) { // between header and 2nd section
$navs.eq(0).addClass("selected")
}
var checkIndex = getCurrent( scrollTop );
if( checkIndex !== currentIndex ) {
currentIndex = checkIndex;
$navs.eq( currentIndex ).addClass("selected").siblings(".selected").removeClass("selected");
}
});
IE is not very forgiving of javascript errors. Try adding some missing semicolons:
if(scrollTop <= 200) { // moved past the header
$navs.eq(0).removeClass("selected"); //missing semicolon
} else if(scrollTop >= 205 && scrollTop <= secondSection ) { // between header and 2nd section
$navs.eq(0).addClass("selected"); //missing semicolon
}
If it is IE only, then IE is having trouble parsing the js. Try running your js through a debugger like JsLint if you run into issues.
精彩评论