2012-02-04 40 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>