Dec

新年新气象

admin

Wordpress

beginner, blog, personal, 个人, 主题开发, 半透明

用WordPress的一个好处就是：一个主题风格用久了，难免会腻，而WP可以很方便的切换风格，即便是自己来设计。

昨天，心血来潮，想着新的一年就要来了，也应该给孩子点新气象，于是，开始着手一个新主题风格。有兴趣的话，欢迎你来看一看：子遨的网站。

从开始构思、到Photoshop设计、再到代码实现，就一天的时间。如果你是个网站开发熟手，可能这样一个简单的改版不算什么，可对于一个不那么熟的业余爱好者，一天能完成到这样，我已经很心满意足了。

这个主题用到了最近看到的一些CSS和jQuery技巧，那话怎么说来着——不亲手实践，你就永远不知道那些技巧该怎么用，看的再多、知道的再多也是白搭！这样一次改版就彻底亲手实践了以下技术：

半透明背景 – 起初直接用CSS代码实现半透明背景效果，可文章中的图片总也是半透明状态，看着很不舒服。后来改用半透明png图片作为背景图片，这个问题才解决。但不确定问题的根源是不是真在这里。

Z-index – 这个参数，说起来容易，可真正操作的时候会发现很多问题。你的脑子或面前纸上一定得有一副图：各个元素的层次结构图，还有同一个div里各个元素的层次图，谁在下面、谁在上面，必须亲手画下来，才能清晰一目了然。这篇文章很不错，能帮你很好的理解z-index的用法。

jQuery.animate – jQuery有很多很有趣的效果，起初我是想用slide效果，这样菜单可以从窗口外滑动进来出去的，挺有趣。但没时间好好设计这个滑动菜单的模样，就改用你现在看到的这样，我直接把相关菜单和widget放在窗口中，然后调用了animate函数，也有互动的效果。只是时间仓促（我的目标是昨天要一定完成可发布的版本），没好好设计，就放了几个文字在那，有些简陋。

text-shadow – 在半透明背景上，似乎用上阴影效果的字体，才够好看。

只是，在完成之后，我很懊恼的发现，在IE6上，这个页面显示的一塌糟——IE6不支持太多东西了！用了修复半透明背景的方法，但好象并没有奏效。作罢，作罢，这个问题，暂时搁置。无奈之举，我只好在页面抬头加了一句注释，算是对看客的一个交待吧。我迫切的希望越来越多的人们能使用Chrome！这样就无须每做一件事情，还得考虑那个叫IE的是不是好用。

希望我还能再接再厉，在下一个热情来到之前，还能先继续把它完善。

PS，下图是最初用photoshop设计出来的想法。对了，还有一个未完成想法，就是有几张不同的照片，然后能切换成不同的背景照片和相应CSS风格。我知道能实现，就是人有点懒了。