我怎樣才能使徽標遵循固定位置標題？

Question

我有一個大約40px高的固定位置標題欄。 它位於原始（未滾動）位置的80px高度標誌之上。

當我向下滾動傳遞原始徽標時，我希望徽標被縮小（並放置到標題欄）。 我怎麼能這樣做？

（我希望它看起來像TechCrunch）

Answer 1

我不知道你到底要模仿你的鏈接的效果，但如果這樣做，那麼這是一個例子，如何：see demo fiddle

樣式表：

#header { 
    height: 40px; 
    width: 100%; 
    position: fixed; 
    top: 0; 
    background: #fff; 
} 
#content { 
    margin-top: 41px; 
} 
#logo { 
    position: relative; 
    height: 200px; 
    width: 200px; 
    top: -41px; 
    float: left; 
    margin-bottom: -41px; 
} 

標記：

<div id="header"> 
    <img src="..." alt="" /> 
    Menu 
</div> 
<div id="content"> 
    <div id="logo"> 
     <img src="..." alt="" /> 
    </div> 
</div> 

在Win7上測試IE7，IE8，IE9，Opera 11.51，Safari 5.0.5，FF 6.0，Chrome 13.0。