私はこのcssでメニューを持っています:
div#menu {
position:absolute;
bottom:0;
width:100%;
z-index: 1000;
height: 57px;
background:transparent url(../images/page_header_b.png) repeat-x;
}
#menu ul.menu {
white-space: nowrap;
}
スクロールすると、メニューの位置を次のように変更します。
$(window).scroll(function(){
if($(window).scrollTop()>150) {
$('div#menu').css( "z-index", "1000" );
$('ul.menu').css( "top", "0" );
$('ul.menu').css( "position", "fixed" );
}
});
メニューは固定ですが、背景はありません。
スクロール時にこれを実行しようとしましたが、変更されません
$('div#menu').css( "background", "transparent url(../images/page_header_b.png) repeat-x");