专注优质Wordpress企业网站搭建与优化

Web2.0风格全屏皮肤 – Ximicc V1.01 for PJBlog【1.0修正版】



Web2.0风格全屏皮肤 - Ximicc V1.01 for PJBlog 1.0修正版

这次更新主要是对IE6及Firefox下的一些细节问题进行修正,主体的风格没有大的变动,希望喜欢这张皮的朋友能放心使用,若有意见或建议无任欢迎。这款皮肤我是在PJ2.7的环境下制作的,在PJ3上我想也不会出现太大的问题。

修正过的几个细节如下:

1.IE6下侧边栏友情链接模块中“更多链接”导致的右边框不对齐:

Ximicc V1.01 for PJBlog

2.IE6下文章内容板块中的断线问题:

Web2.0风格全屏皮肤 - Ximicc V1.01 for PJBlog

3.IE6下侧边栏与主内容间距不足的问题:

Web2.0风格全屏皮肤 - Ximicc V1.01 for PJBlog

4.IE6和FF下侧边各模块之间的间距问题:

SEO优化,CSS教程,Wordpress博客

5.IE6下日志全文页标题图片下沉问题:

Web2.0风格全屏皮肤 - Ximicc V1.01 for PJBlog

6.发表日志成功提示页链接文字跑出表格问题:

Web2.0风格全屏皮肤 - Ximicc V1.01 for PJBlog

7.按钮及其它一些样式的修改:

汇聚博客资源,点亮博客价值 - 西米CC

Web2.0风格全屏皮肤 - Ximicc V1.01 for PJBlog - 西米CC

预览站点中更改了部分日志分类图标,更加简约不花哨,有需要的可以拿去替换一下:

>>点击下载替换图标<<

把这些图标上传到根目录images/ICONS下,然后进入后台更改即可!

PS:鉴于PJ3去掉了顶部的分页信息,像本站一样在内容板块中增加一个带边框的滚动公告,在视觉对齐效果上会改良许多。大致的步骤就是进入后台“界面与插件”下的“设置模块”选项,添加一个新的内容模块,命名随意如“bulltin”等,排序值设为-2等最大优先权,添加保存后选择“编辑HTML”,粘贴如下代码即可:

  1. <div style="border: 1px dotted #A2C66D;padding: 3px;"><script>
  2. var marqueeContent = new Array();
  3. marqueeContent[0]=&#39;<li>建议使用浏览器IE6.0 或Firefox1.5,转载本站内容请注明出处,谢谢!&#39;;
  4. marqueeContent[1]=&#39;<a href="bloglink.asp"  target="_blank"><li>申请友情链接请点这里看说明后提交!已提交的请确认贵站已经做上本站链接。</a>&#39;
  5. marqueeContent[2]=&#39;<a href="register.asp"  target="_blank"><li>本站内容登录后才能复制,防不住高手哈哈...真诚希望大家能注册会员,互相交流!</a>&#39;
  6. marqueeContent[3]=&#39;<a href="register.asp"  target="_blank"><li>虽然发表评论不用注册,但是为了保护您的发言权,建议您注册帐号。</a>&#39;
  7. marqueeContent[4]=&#39;<a href="LoadMod.asp?plugins=GuestBookForPJBlog"  target="_blank"><li>如果您对本站有任何建议或意见,或者想发牢骚,请点这里留言!</a>&#39;
  8. var marqueeInterval=new Array();
  9. //定义一些常用而且要经常用到的变量
  10. var marqueeId=0;
  11. var marqueeDelay=3000;
  12. var marqueeHeight=17;
  13. //接下来的是定义一些要使用到的函数
  14. function initMarquee() {
  15. var str=marqueeContent[0];
  16. document.write(&#39;<div id=marqueeBox style="text-align:left;overflow:hidden;height:&#39;+marqueeHeight+&#39;px" onmouseover="clearInterval(marqueeInterval[0])" onmouseout="marqueeInterval[0]=setInterval(\&#39;startMarquee()\&#39;,marqueeDelay)"><div>&#39;+str+&#39;</div></div>&#39;);
  17. marqueeId++;
  18. marqueeInterval[0]=setInterval("startMarquee()",marqueeDelay);
  19. }
  20. function startMarquee() {
  21. var str=marqueeContent[marqueeId];
  22. marqueeId++;
  23. if(marqueeId>=marqueeContent.length) marqueeId=0;
  24. if(marqueeBox.childNodes.length==1) {
  25. var nextLine=document.cr&#101;ateElement(&#39;DIV&#39;);
  26. nextLine.innerHTML=str;
  27. marqueeBox.appendChild(nextLine);
  28. }
  29. else {
  30. marqueeBox.childNodes[0].innerHTML=str;
  31. marqueeBox.appendChild(marqueeBox.childNodes[0]);
  32. marqueeBox.scrollTop=0;
  33. }
  34. clearInterval(marqueeInterval[1]);
  35. marqueeInterval[1]=setInterval("scrollMarquee()",20);
  36. }
  37. function scrollMarquee() {
  38. marqueeBox.scrollTop++;
  39. if(marqueeBox.scrollTop%marqueeHeight==(marqueeHeight-1)){
  40. clearInterval(marqueeInterval[1]);
  41. }
  42. }
  43. initMarquee();
  44. </script></div><div style="padding: 3px;"></div>

皮肤名称:Ximicc V1.01

使用环境:PJ-Blog V2007 build 05

兼容测试:此风格通过IE6、IE7、Firefox 测试

下载地址: 【Ximicc V1.01】

[ 以下内容您也可能感兴趣 ]

Add a Comment