There's a bit of a jitter to my script. Lets say theres an element that is 25px away from the top of my browser, and when I continue to scroll down. That element won't turn position:fixed;
until the top of my browser touches. then that element will follow when I scroll down. However, that jitter is coming from when I scroll back to the top, that element will follow to the top of my page, then it will reset itself back to its orgiinal position (25px away from the top).
Is there a way to remove the jitter?
Thanks!
Here's my jquery script:
$(function() {
var a = function() {
var b = $(window).scrollTop();
var d = $("#notification-anchor").offset({scroll:false}).top;
开发者_如何学Python var c = $("#notification");
if (b > d) {
c.css({position:"fixed",top:"0px"})
} else {
if(b<=d){
c.css({position:"relative"})
}
}
};
$(window).scroll(a);a()
});
Try with the following code. .toolsbar will stick on top of the page like GMail toolbar. Is that you want ?
$(function() {
var $sidebar = $('.toolsbar');
$window = $(window);
offset = $sidebar.offset();
topPadding = 0;
$window.scroll(function() {
if ($window.scrollTop() > offset.top) {
$sidebar.css({
'top': '0',
'position': 'fixed'
});
} else {
$sidebar.css({
'top': '',
'position': ''
});
}
});
});
精彩评论