jquery - スクロール中のjQuery Sticky Navigation Center

Question

スクロール中にナビゲーションの幅を設定するにはどうすればよいですか。ナビゲーションは、スクロール中に 100% の幅に収まります。幅を left:0 よりも 500px に設定すると、配置されます。左側では、ナビゲーションを自動中央に設定できません。

http://jsfiddle.net/aY8a7/

$(function() {

    var sticky_navigation_offset_top = $('#sticky_navigation').offset().top;

    var sticky_navigation = function(){
        var scroll_top = $(window).scrollTop(); // our current vertical position from the top

        if (scroll_top > sticky_navigation_offset_top) {
            $('#sticky_navigation').css({ 'position': 'fixed', 'top':0, 'left':0 });
        } else {
            $('#navigation_menu').css({ 'position': 'relative' });
        }  
    };

    sticky_navigation();

    $(window).scroll(function() {
         sticky_navigation();
    });

});

Answer 1

これを試してください：http：//jsfiddle.net/aY8a7/1/

$(function() {

    var sticky_navigation_offset_top = $('#sticky_navigation').offset().top;

    var sticky_navigation = function(){
        var scroll_top = $(window).scrollTop(); // our current vertical position from the top
        var $ul = $('#sticky_navigation ul').width()+'px';

        if (scroll_top > sticky_navigation_offset_top) {
            $('#sticky_navigation').css({ 'position': 'fixed', 'top':0, 'left':0 });
            $('#sticky_navigation ul').css({'width':$ul, 'display':'block', 'text-align':'center'});
        } else {
            $('#navigation_menu').css({ 'position': 'relative' });
        }  
    };

    sticky_navigation();

    $(window).scroll(function() {
         sticky_navigation();
    });

});