给micolog主题增加随机banner的功能 - Angel's Blog.

ing
 
 
软件开发,程序设计,前端设计
 
 
首页 > share > 给micolog主题增加随机banner的功能

给micolog主题增加随机banner的功能

 

前几天有一位网友问过我关于micolog主题phina的问题,其中有个问题是关于banner显示问题,他的要求如下:

实现banner随机显示的功能(因为在phina2下的imagesheaders有很多banner图片);

其实实现起来非常简单(注意:以phina2为demo,其他的主题也可以按照这种方式去修改,使用javascript实现):

1)修改phina2主题模板下的base.html:

:将base.html中的<div id=”header” class=”box heads”>删除或者使用html注释。

:在“<!– banner START –>..<!– banner END –>”之间添加如下的javascript代码片段:

<!-- banner START -->
<script language="javascript" type="text/javascript">
	var logoImg = new Array(4);
	logoImg[0] = '<div id="header" class="box heads">';
	logoImg[1] = '<div id="header" class="box heads1">';
	logoImg[2] = '<div id="header" class="box heads2">';
	logoImg[3] = '<div id="header" class="box heads3">';
	var index = Math.floor(Math.random() * logoImg.length);
	document.write(logoImg[index]);
</script>
<!-- banner END -->

 

2)修改phina2主题模板下的style.css:

将如下的三个类样式添加到样式表中:

.heads1{background:url(images/headers/i_love_music.jpg) no-repeat;}
.heads2{background:url(images/headers/left_right.jpg) no-repeat;}
.heads3{background:url(images/headers/sheeps.jpg) no-repeat;}

保存就okay了(记得将base.html编码保存为utf-8)。

嘿嘿,最后罗嗦一句:

话说我的博客pr值终于变化了;www.0ee.comblog.q86.net同时升级pr值为1(诶。。可怜的1也算是升吧,也是对我小小的鼓励)。。

放假回老家天天除了吃还是吃,,然后就是睡觉,整个人都快变傻了,也不写code了。。诶。可怜的15天假期。。

或者通过RSS 关注本站的更新 ^ O ^ 。” —  by  转载请注明:来自 Angel's Blog.
本文永久链接: http://www.0ee.com/2011/01/25/micolog-use-random-banner-show.html
 
分类: share标签: , , ,
 
  • QQ书签
  • Del.icio.us
  • 百度收藏
  • Google
  • 饭否
  • FriendFeed
 

 
评论 (10) Trackbacks (0)
发表评论 Trackback
 
10 Comments Contributed by Visitors
  1.     等待思索 2011年1月26日08:59 1#

    怎么个随机显示??

  2.     basncy 2011年1月31日13:10 2#

    看到您的博客主题很漂亮,能否分享一下您博客当前的主题吗?

  3.     xyu_ovi 2011年2月3日08:56 3#

    请问怎么添加回复的邮件提醒功能啊!

  4.     xyu_ovi 2011年2月3日10:15 4#

    @Angel
    原来是这样啊!谢谢了。

  5.     xyu_ovi 2011年2月3日10:34 5#

    用no-reply这样的邮箱是怎么实现的!!!
    本人小白望大大指点。

  6.     Angel 2011年2月3日10:11 6#

    @xyu_ovi
    你现在用的zbench没有邮件通知?这个主题本身移植之后支持通知的,应该是你的设置有问题。
    在后台——设置——notify,钩选就可以了,只要被回复的人也允许接收邮件通知就ok了。

  7.     Angel 2011年3月3日11:06 7#

    @zouzhan
    照着修改按部就班应该可以的。 ok

  8.     zouzhan 2011年3月3日08:12 8#

    好像是用这种方法之后 网站的title就没法显示了

  9.     ziputi 2011年4月9日14:56 9#

    Angel :

    @xyu_ovi
    你现在用的zbench没有邮件通知?这个主题本身移植之后支持通知的,应该是你的设置有问题。
    在后台——设置——notify,钩选就可以了,只要被回复的人也允许接收邮件通知就ok了。

    我说我的回复通知怎么不起作用,原来是我在后台不小心把那个插件禁用了

  10.     Angel 2011年1月26日10:32 10#

    @等待思索
    很简单的一个功能;就是在打开页面的时候随机的显示顶部的这几个banner图片。 ok

Leave Comments Here...

:) :-D :( :-o 8-O :-? 8) lol :-x :-P oops cry evil twisted wink ? idea :-| arrow mrgreen roll !

(required)

(required)

网址随您("http://"可以省略)

(Ctrl+Enter)

  • 本站不会泄露您的 Email 地址, 敬请放心.
  • 本站已开启缓存, 请不要重复提交评论.
  • 请注意: 带有 《广告(链)、不健康、或者 产品名字》 的评论一律视为spam.
  • 支持常用 HTML 标签调用, 插入 HTML 标签需注意: < == &lt;> == &gt;.
  • 仅当某人针对您的评论做出回应时, 您才会收到由本站发出的邮件通知.
  • 如您希望以相同方式通知某位网友, 请点击  按钮进行回复.
  • 允许在评论中使用如下代码: 
    <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> 
    <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> 
    .
  • 鼠标悬浮到评论中的 @someone 区域即可自动显示 someone 的评论内容.
 
 
  • 正在加载...