在过去的一年中,我注意到很多网站已经将他们的共享/人气统计数据移动到左侧边栏,即使您向下滚动窗口,该边栏仍然可以在屏幕上看到。以下是具有此类功能的网页的网址:http://news.cnet.com/8301-31921_3-57371426-281/anti-sopa-forces-have-isp-snooping-bill-in-their-crosshairs如何创建评论数量,Facebook喜欢计数和其他社交媒体流行统计的左边栏?
什么是创建这种侧边栏的最佳方法?
在过去的一年中,我注意到很多网站已经将他们的共享/人气统计数据移动到左侧边栏,即使您向下滚动窗口,该边栏仍然可以在屏幕上看到。以下是具有此类功能的网页的网址:http://news.cnet.com/8301-31921_3-57371426-281/anti-sopa-forces-have-isp-snooping-bill-in-their-crosshairs如何创建评论数量,Facebook喜欢计数和其他社交媒体流行统计的左边栏?
什么是创建这种侧边栏的最佳方法?
一个简单的方法是使用CSS来进行绝对定位它,所以它出现高于一切
试试这个您的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>