仿TOM网站首页建党90周年背景-领先建站CMS提供服务商我们专注于CMS建站产品的研发

6497 查看	13 回复

主题：[分享]仿TOM网站首页建党90周年背景 [收藏主题]

转到：

悠客当前离线

213 主题	15 广播	7 粉丝

级别:二年级

用户积分:996 分
登录次数:401 次
注册时间:2010/11/8
最后登录:2019/10/28

悠客发表于：2011/6/23 14:05:33 | 显示全部帖子查看该作者主题楼主

请先看下http://tom.com/首页的效果，您再决定是否需要此功能。

实现方法很简单，步骤如下：

一、进入后台，标签-自定义标签-头部通用，修改该自定义标签，在文本框顶部输入

<style type="text/css">
/*建党背景*/
.wrapperBg{background:url(/images/plus/pagebg2.jpg) repeat-x left top #da0605;}
.jd-wrapper{position:relative;height:323px;background:url(/images/plus/jd_topbg.jpg) no-repeat center top;z-index:0;}
.jd-wrap .wrapper-btn-colse{position:absolute;right:-19px;top:0;width:19px;height:48px;background:url(/images/plus/close_jd.gif) no-repeat left top;text-indent:-9999px;overflow:hidden;cursor:pointer;}
.jd-wrap{width:970px;margin:0 auto;position:relative;z-index:5;margin-top:-264px;background:#fff;}
.nowrapper{display:none;}
</style>
</head>
<body id="warpperBg" class="wrapperBg">
<div class="jd-wrapper">
</div>
<div class="jd-wrap">
<span class="wrapper-btn-colse" id="wrapper_btn_colse">关闭</span>
<script src="/images/plus/page.js" language="javascript" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
//widget theme
var bodyID = $("#warpperBg");
var wrapBtn = $("#wrapper_btn_colse");
var ntes_wrapper = $(".jd-wrapper")[0];
var ntes_wrap = $(".jd-wrap")[0];
bodyID.addCss("wrapperBg");
wrapBtn.addEvent("click",function() {
bodyID.removeCss("wrapperBg");
ntes_wrap.style.marginTop = "0";
ntes_wrapper.style.display = "none";
wrapBtn.style.display = "none";
});
//]]>
</script>

保存标签

二、下载相关图片和JS文件到Images/Plus目录下

下载信息 [文件大小：90.86 KB 下载次数：次]

后台更新下缓存即可。

反对(0)

底部