第一步:下载素材包,解压里面的文件夹到网站根目录
第二步:进入后台,点击模板编辑 修改index.html )首页文件
</head>上方加入以下代码
- <link rel="stylesheet" href="../../css/style.css" type="text/css">
- <script src="../../js/jquery-2.0.3.min.js" type="text/javascript"></script>
- <script type="text/javascript">
- $(document).ready(function(){
- $(".side ul li").hover(function(){
- $(this).find(".sidebox").stop().animate({"width":"124px"},200).css({"opacity":"1","filter":"Alpha(opacity=100)","background":"#ae1c1c"})
- },function(){
- $(this).find(".sidebox").stop().animate({"width":"54px"},200).css({"opacity":"0.8","filter":"Alpha(opacity=80)","background":"#000"})
- });
-
- });
- //回到顶部
- function goTop(){
- $('html,body').animate({'scrollTop':0},600);
- }
- </script>
复制代码
<body>下方加入以下代码
- <div class="side">
- <ul>
- <li><a href="游戏中心链接">
- <div class="sidebox" style="width: 54px; opacity: 0.8; background: rgb(0, 0, 0);"><img src="../../images/side_icon01.png">游戏中心</div>
- </a></li>
- <li><a href="游戏资讯链接">
- <div class="sidebox" style="width: 54px; opacity: 0.8; background: rgb(0, 0, 0);"><img src="../../images/side_icon02.png">游戏资讯</div>
- </a></li>
- <li><a href="QQ链接">
- <div class="sidebox" style="width: 54px; opacity: 0.8; background: rgb(0, 0, 0);"><img src="../..images/side_icon04.png">QQ客服</div>
- </a></li>
- <li><a href="微博链接">
- <div class="sidebox" style="width: 54px; opacity: 0.8; background: rgb(0, 0, 0);"><img src="../../images/side_icon03.png">新浪微博</div>
- </a></li>
- <li style="border:none;"><a href="javascript:goTop();" class="sidetop"><img src="../../images/side_icon05.png"></a></li>
- </ul>
- </div>
复制代码
把你的相关链接及文字替换成你想要的 保存即可
|