最近从一个外国朋友那知道一个很cool的侧边栏，想分享给有兴趣的blogger朋友们 ，具体实例请看我网页的左侧部分即是，你可以先体验一下再决定是否安装。-----------------------------------------------------------------
具体操作步骤如下：
一：依次点击布局—修改HTML—勾选扩展窗口小部件模板选项，然后直接复制下面的代码到]]>的上面，（你可用ctrl+f找到]]>）
------------------------------------
.fixed_menu {
position: fixed; /*set the position type for non IE systems*/
top: 140px;
left: 0px;
width: auto;
margin: 0 0px 0px 0px;
background: #ffffff;
opacity:.900;
filter: alpha(opacity=90);
padding: 7px 5px 5px 5px;
-moz-border-radius-topright: 10px;
-moz-border-radius-topleft: 0px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 0px;
}
.fixed_menu a:hover img {
position: relative;
top: 2px;
left: 2px;
border-top: 1px solid #b3b3b3;
border-left: 1px solid #b3b3b3;
border-bottom: 2px solid #999999;
border-right: 2px solid #999999;
}
.fixed_menu a { display: block; } /*Optional : This puts each link in the menu on a new line, remove if you want a horizontal menu*/
* html .fixed_menu {position:absolute;} /*IE only change the position mode of the menu*/
-------------------------------------------
二：然后把下面的代码复制到<body>的下面
-------------------------------------------
<div class='fixed_menu'>
<a href='http://www.blogfixes.com/' title='Home'><img src='http://blogfixes.googlepages.com/HomeIcon1.png'/></a>
<a href='http://www.blogfixes.com/2008/05/author.html' title='Mail me'><img src='http://blogfixes.googlepages.com/EmailIcon1.png'/></a>
<a href='http://www.blogfixes.com/2008/06/free-blogger-templates-complete.html'><img src='http://blogfixes.googlepages.com/Templates1.JPG'/></a>
<a href='http://www.feedburner.com/fb/a/emailverifySubmit?feedId=2132289&loc=en_US' title='Subscribe to Posts via Email'><img src='http://blogfixes.googlepages.com/feediconblue1.png'/></a>
<a href='http://feeds.feedburner.com/blogfixes' title='Subscribe to Posts via RSS'><img src='http://blogfixes.googlepages.com/FeedIconorange.png'/></a>
<a href='javascript:scroll(0,0)' title='Scroll to top of this page'><img src='http://blogfixes.googlepages.com/top.PNG'/></a>
</div>
----------------------------------------
蓝色部分可以自行修改。
先把自己喜欢的icon上传到网路空间（如果没有 请到这里找），然后找到图标的链接代替上面的蓝色部分的链接。
这样就可以了，祝你顺利！
0 comments:
Post a Comment