如何在自己的博客里添加每日口语和划词翻译功能

几天我写这篇文章所说的所有功能都是围绕这 dict.cn 这个网站提供的服务来说的。dict.cn 这个网站是我无意中发现的，感觉非常的好，对 ajax 技术的使用可以说是炉火纯青啊。他的整个运营模式我也非常喜欢，是个词霸在 web 2.0 的典型应用，大家有空可以去看看。 www.dict.cn

大家看看我博客（pinzui.blogcns.com）上面的每日口语功能，实现这个功能其实很简单，就是在首页上面绘出一个 div ，然后把我们的从 dict.cn 上面得到的显示每日口语的脚本放上就ok了，当然唯一一点值得注意的就是 div 的优先级，因为如果使我们自定义的 div 不指定他的优先级会被上面的 div 覆盖，就不能显示了。下面给出代码，把它放到博客园后台的自定义 css 模块里面就好了。

#topdictcn{ position:absolute; font-size:12px; left:200px; top: 96px; z-index:100; }

上面拿个层的z-index定义成一百就是让他在最上面，然后在页首html代码里面添加下面的代码就搞定了。

<div id="topdictcn">
<span id="dict_daily">
<a href="http://dict.cn/" target="_blank">Dict.CN</a>
</span>
<script language="JavaScript" src="http://dict.cn/daily.php" defer="defer">
</script>
</div>

下面在看看如何添加划词翻译功能，其实也是很简单，加入下面的代码

<script src="http://dict.cn/hc/" type="text/javascript"></script>
<script type="text/javascript">
dictInit();
</script> 

也可以添加一个划词翻译开关，在你想要的位置加入下面代码就搞定了

<span id="dict_status"></span>

具体的效果可以看看我的博客上面的效果，我没有打开划词翻译功能，因为我的博客都是汉语，开个划词翻译好像有些多此一举。