2013-05-05 111 views

回答

2

HTML

<div id="follow"> 
    <p>This element will follow all the way down to page</p> 
    <p></p> 
</div> 

jQuery的

$(document).ready(function() { 
    var speed = 1000; 
    var current_top = parseInt($('#follow').css('top')); 
    $(window).scroll(function() { 
     var top = $(window).scrollTop(); 
     $('#follow').css('top', top + current_top); 
    }); 
}); 

CSS

#follow { 
    position:absolute; 
    left:10px; 
    top:10px; 
    height:50px; 
    width:100%; 
    background-color:#f0f0f0; 
    border:1px solid #404040; 
    padding:8px; 
} 

工作演示http://jsfiddle.net/cse_tushar/YpHxd/

+0

欢迎.. !! :) – 2013-05-05 04:05:57

1

这会不会帮你换你的头脑周围...

编辑

升级版本调用动画的功能在IE中出现波涛汹涌的行为。

function animateMenu(pos) { 
    $("#sticky").stop(true, false).animate({ 
     marginTop: pos 
    }, 500); 
} 

var offset = $("#sticky").offset().top; 
$(window).scroll(function() { 
    console.log($(window).scrollTop()); 
    if ($(window).scrollTop() > offset) { 
     animateMenu($(window).scrollTop()); 
    } 
}) 

以前的小提琴:http://jsfiddle.net/djwave28/eFCpc/1/

新小提琴:http://jsfiddle.net/djwave28/eFCpc/2/