2012-02-04 39 views
0

在過去的一年中,我注意到很多網站已經將他們的共享/人氣統計數據移動到左側邊欄,即使您向下滾動窗口,該邊欄仍然可以在屏幕上看到。以下是具有此類功能的網頁的網址:http://news.cnet.com/8301-31921_3-57371426-281/anti-sopa-forces-have-isp-snooping-bill-in-their-crosshairs如何創建評論數量,Facebook喜歡計數和其他社交媒體流行統計的左邊欄?

什麼是創建這種側邊欄的最佳方法?

回答

0

一個簡單的方法是使用CSS來進行絕對定位它,所以它出現高於一切

0

試試這個您的HTML頁面上設置的Z指數

<style> 
.side-sharebar { 
    display: block; 
    left: 482px; 
    position: fixed; 
    top: 20px; 
    -moz-border-bottom-colors: none; 
    -moz-border-image: none; 
    -moz-border-left-colors: none; 
    -moz-border-right-colors: none; 
    -moz-border-top-colors: none; 
    background-color: #EEEEEE; 
    border-color: #CCCCCC transparent #CCCCCC#CCCCCC; 
    border-radius: 3px 0 0 3px; 
    border-style: solid; 
    border-width: 1px; 
    box-shadow: -6px 0 6px -6px rgba(0, 0, 0, 0.25) inset, 0 1px 0 #FFFFFF inset; 
    left: auto !important; 
    margin-left: -98px; 
    margin-top: 2px; 
    position: absolute; 
    top: 0; 
    width: 76px; 
} 

.side-sharebar ul li { 
    border-bottom: 1px solid #CCCCCC; 
    box-shadow: 0 1px 0 #FFFFFF; 
    padding: 10px 2px 10px 0; 
    position: relative; 
    text-align: center; 
} 

.side-sharebar ul { 
    list-style: none outside none; 
} 
</style> 
.... 
<div class="side-sharebar"><ul><li>one</li><li>two</li></ul></div>