首页 > 代码库 > 给博客添加Flash时钟
给博客添加Flash时钟
依稀记得在cnblogs很多大牛的博客里见到过大牛的新闻公告栏里那种动感十足的Flash时钟控件，先上图：
作为一名刚的接触博客菜鸟，自然免不了一番好奇。博客设置选项里翻来覆去找（以为是cnblogs自带的功能...），主题样式换了好几个，就是找不到带Flash样式的。不过倒是在设置里找到个“博客侧边栏公告”的东东，如图所示。
想起刚上大学那会大家在网上搜免费的QQ空间主题js代码的经历，感觉突破口就是它了。稍稍问了一下度姑娘，还真找到了解决方案，总结如下：
1、添加object标签
既然说支持HTML代码，那灵活度就大了，找到这个酷炫的Flash时钟swf资源的URI，设定一下object的标签属性即可，上代码：
1 <object width="200" height="75" data="http://files.cnblogs.com/arthurymn/honehone_clock_wh.swf" type="application/x-shockwave-flash">2 <param name="src" value="http://files.cnblogs.com/arthurymn/honehone_clock_wh.swf" />3 </object>
只需要将data属性的值修改成你喜欢的Flash的URI即可，当然，width和height也需要根据页面的情况调整一下。这里有个比较人性化的地方，在博客的“管理-文件”页面，可以上传自己本地的Flash，然后这个swf文件将成为你的资源外链，再也不用担心自己挂的网络URI无效了之后出现个空白框框了。
（这种方案似乎不能兼容所有浏览器，自己测试360极速和兼容模式，以及IE11下可以正常显示）
2、embed标签
<embed src="http://files.cnblogs.com/arthurymn/honehone_clock_wh.swf" />
<embed> 标签是 HTML 5 中的新标签,当然也就只能在支持HTML5的浏览器下正常显示了。一般使用如下写法：
（参考：http://www.cnblogs.com/wenyang-rio/archive/2013/01/05/2845973.html）
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="160" height="70" id="honehoneclock" align="middle"><param name="allowScriptAccess" value="always"><param name="movie" value="http://chabudai.sakura.ne.jp/blogparts/honehoneclock/honehone_clock_wh.swf"><param name="quality" value="high"><param name="bgcolor" value="#ffffff"><param name="wmode" value="transparent"><embed wmode="transparent" src="http://chabudai.sakura.ne.jp/blogparts/honehoneclock/honehone_clock_wh.swf" quality="high" bgcolor="#ffffff" width="160" height="70" name="honehoneclock" align="middle" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"></object>
这个方案里头object中嵌套着一个embed标签，确实提高了代码对各类浏览器的兼容性，自己保存成.html文件在自己本本的所有浏览器上试了一下，都可以正常显示，可谓是绝佳方案，绝非吾等菜鸟写出来的网页代码。然而一个奇怪的事情发生了，修改完毕之后点击保存，进入“我的博客”看效果，竟然没出来！！！再回去设置里，发现<embed/>里的代码消失了，又多试了几次，效果一样，看来cnblogs不大待见embed啊，提交不上去啊,bug了有木有......于是乎第3种方案！
3、js动态写入HTML代码
<script type="text/javascript">var swfTitle = "honehoneclock";var sUrl = "http://files.cnblogs.com/arthurymn/honehone_clock_wh.swf";var sHtml = "";sHtml += ‘<object width="200" height="75" data="http://files.cnblogs.com/arthurymn/honehone_clock_wh.swf" type="application/x-shockwave-flash">‘;sHtml += ‘<param name="src" value="http://files.cnblogs.com/arthurymn/honehone_clock_wh.swf" />‘;sHtml += ‘<embed wmode="transparent" src="http://www.mamicode.com/‘ + sUrl + ‘" quality="high" bgcolor="#ffffff" width="160" height="70" name="‘ + swfTitle + ‘" align="middle" allowScriptAccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />‘;sHtml += ‘</object>‘;document.write(sHtml);</script>
这样，不论是object标签还是embed标签，document.write之前都是当做字符串处理的，点击设置里的“保存”按钮，再返回“我的博客”，顺利成功显示！
（注：在让js生效之前，需要向“博客园团队”发送消息，申请js权限才能使用，本人昨晚抱着试试的态度，发了条信息，说想申请js，今天果断通过申请了，cnblogs一如既往的高效啊，向高效率精神致敬！）
纯业余整理，若有解释不当之处，欢迎指正:)