JQuery - Sticky sidebar not working in Firefox
Posted
by
user1473358
on Stack Overflow
See other posts from Stack Overflow
or by user1473358
Published on 2012-06-25T14:52:31Z
Indexed on
2012/06/25
15:16 UTC
Read the original article
Hit count: 338
I'm working on a site with a Sticky sidebar (fixed position under certain conditions, etc) that is working fine in Chrome & Safari, but breaks in Firefox. I'm not sure what the issue is since I didn't write the script:
$(document).ready(function() {
/*
var defaults = {
containerID: 'toTop', // fading element id
containerHoverID: 'toTopHover', // fading element hover id
scrollSpeed: 1200,
easingType: 'linear'
};
*/
$().UItoTop({ easingType: 'easeOutQuart' });
if (!!$('.sticky').offset()) { // make sure ".sticky" element exists
var stickyTop = $('.sticky').offset().top; // returns number
var newsTop = $('#news_single').offset().top; // returns number
$(window).scroll(function(){ // scroll event
var windowTop = $(window).scrollTop(); // returns number
var width = $(window).width();
var height = $(window).height();
if (stickyTop < windowTop && width > 960 && height > 450){
$('.sticky').css({ position: 'fixed', top: 40 });
$('#news_single').css({ left: 230 });
}
else {
$('.sticky').css('position','static');
$('#news_single').css({ left: 0 });
}
});
}
});
Here's the site (the sidebar in question is the one with the red header, to the left): http://www.parisgaa.org/parisgaels/this-is-a-heading-too-a-longer-one
I'd appreciate any help with this.
© Stack Overflow or respective owner