给博客添加Flash时钟

依稀记得在cnblogs很多大牛的博客里见到过大牛的新闻公告栏里那种动感十足的Flash时钟控件，先上图：

作为一名刚的接触博客菜鸟，自然免不了一番好奇。博客设置选项里翻来覆去找（以为是cnblogs自带的功能...），主题样式换了好几个，就是找不到带Flash样式的。不过倒是在设置里找到个“博客侧边栏公告”的东东，如图所示。

aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAgoAAADnCAYAAAB/hH4gAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAmQSURBVHhe7d0/jx1XHQbgMYICQYNSoDThA5iCAoUKN5GIXBq5IjSmo0mVxhISokBuUuUDkIZQWaQ0KdKYCktIFLijgSaicMeKAiSzJ74/79mz887cuXdXId7niY5mzp85c2ZXmvPq7npz4+Tk5PkEADDjK7sjAMAFggIAEAkKAEAkKAAAkaAAAESbg8KtW7d2Z+dVe+ova/3Nljnmxh5zfbp233Gjfccdap/558Zc9bouQ7/GOl9bd+ufKwAc5qhPFMYX8dxxLEvtvbX+8vjx48X+NcdeP+ey5rvsda169mh679Z706Nnu3p52f50+uB0TW1dF8tp/9/auNPzD57uLizPpkfvtTEfTJ/3pPvsYfx+jeto/WOZ088BQHZUUBhfxmO9Sf196dXLvhn708t9nONQ/b2P1eaq9dZ537amjRvXMs7TylL7nL5/bexFN6d3d9+Txx/fn948/e/+x/V9fH+6/a3dsIcfng8BTz+aHjzZne+prSt9L/r2F/d+Ua/jPs/Uxm57doDr6dI/Uejr/Qu96fuXxh2qn7O/x9hW50vHXmsb15g2mhpbpenr1XaIcZ6aK7W3tdQa69j39+eX5+50//40Pfjo7FOFp58+nO6eNr65qx+jnqmeB4CrtSkojJtOs8/G08ZXX19GW1/+bXyVpp937j5jfx3HsmRtjWvX76Pd4zLm6Z+nHcev11i/LG/cvjfdrU8Vnj2aPvzH/emdDSmhX0+/vnasZ6rnaqp9q/qaAJBtCgr1Mh5f0v2LfHzxtvrcC7nae2N9TRu/9ZpxHWvm1llaez9fOx/LUvsh5uaZa5tTX68qfduZJ9ODO+fnu3XnwWnrFjent+4+mT598mx6+tGD6Y17t6fXdj1r2v369YxrTWqt5eXad219HwD7O+pHD834Ih9f5n1f//Iex825ypf7PnOP65xbdz1Xne9bDlXXjvNVSWqN7Vilr5/pf+9gVz7/fYRtbr7Tfv5wZ/r5w7vTWzd3jXtYeoY5tfb+unNr3xUADnN0UFhSm1CV/sU99l2Wus+cvq+O/RqqlDTPqB83N99YjtXuNzdPa5tbS1Pt7Vilr1+6125P9+6exo7770wbcsJmV7J2AF46Kij0L+k67zerduzH1MZVm1czjil921z/IdJ9xjKnf66mf4bROF9f9tHGLc3fjGPG9TVz91yb9zLdfPfx9P7tfX/osGzueee09rEkrW/8+gBw3lFBYXwht1Lto9q0+rLV2jXtvjWmX9Mh9+rNzdHqrf2LVGvY8oz/D+t+YeZ3IS78/YXzltZe7W3MWAA43I2Tk5Pnu/O9tBdy//Jdqzfp5d7MjW1t47HXty2NS7aOXdPPtXX8kqV11n2qf6z30jxL83/Rtj57O1+7pu9bGgvAmaODQtO/qJvUP0pzNX17P67vH6+vvjlz8+07fsncGpauXetf0q83zVFjqn+sN/vM80Vb+zqt9Ze55wdgf5uDAgBwfVzpv3oAAL7cBAUAIBIUAIBIUAAAIkEBAIgEBQAgEhQAgEhQAAAiQQEAiAQFACDa/Cecv/GD304nf/rprnaxfqg0z9L8fV87H43r7LW+uTYA4MyVfaLQNuG1koxjxnrSNvoqc+b6lsYDwHW36ROFtlG3TXVpw65Nt8aWpfra2FLt7diba2vGOXtpHgDgzEFBoTfX1oztS/U674/JeM2h5u4PAJy3d1CozXvLRr5mHLtl4966ntF4j33uCQDXzV5BoTbR8dj3LZ03W+rtPGljaux4zSHzjfo5AOC62+uXGec2z7b51gbcnx+iXTveo+rjsfT3LrWOvq1p1/al2uo49gEALxz8rx76jTVttOPGPdZ7/Zg1471Ltfdtvbp3f221AQAXHfzLjHXet/XG9rV6r/Ul4xxNa5u7psb245J9xgDAdXPUJwptc73MjbXf7Gve8di0cXMbezuv0oxj6rpqH+v9XADAEUGhba5tY+032kPVHPtu1G1cP7buX/NUfZxvvK6ZawMAXjj4Dy6Nm2u/Oc/1lxrXLI1Zmr+s3Wcc22t9c20AwJlNQQEAuF6u7P/1AAB8+QkKAEC0148e/vPZ4+m///zjrgYAvCq++u0fTl97/daudtFqUGgh4a+//9n093+9vmsBAF4V3/nmZ9N3f/ybGBZWg8K///Lr6ZNP/jD95Fd/3rUAAK+K3/3y+9Pbb/9o+vr3frFrOc/vKAAA0eagcOPGjd0ZAPCq84kCABAJCgBAJCgAAJGgAABEggIAEAkKAEAkKAAAkaAAAESCAgAQCQoAQCQoAACRoAAARIICABAJCgBAtDkoPH/+fHcGALzqfKIAAESCAgAQCQoAQCQoAACRoAAARIICABAJCgBAJCgAAJGgAABEggIAEAkKAEAkKAAAkaAAAESCAgAQCQoAQCQoAACRoAAARIICABAJCgBAJCgAAJGgAABEggIAEAkKAEAkKAAAkaAAAESCAgAQCQoAQCQoAACRoAAARIICABAJCgBAJCgAAJGgAABEggIAEAkKAEAkKAAAkaAAAESCAgAQCQoAQCQoAACRoAAARIICABAJCgBAJCgAAJGgAABEggIAEAkKAEAkKAAAkaAAAESCAgAQCQoAQCQoAACRoAAARIICABAJCgBAJCgAAJGgAABEggIAEAkKAEAkKAAAkaAAAESCAgAQCQoAQCQoAACRoAAARIICABAJCgBAJCgAAJGgAABEggIAEAkKAEAkKAAAkaAAAESCAgAQCQoAQCQoAACRoAAARIICABAJCgBAJCgAAJGgAABEggIAEAkKAEAkKAAAkaAAAESCAgAQCQoAQCQoAACRoAAARIICABAJCgBAJCgAAJGgAABEggIAEAkKAEAkKAAAkaAAAESCAgAQCQoAQCQoAACRoAAARIICABAJCgBAJCgAAJGgAABEggIAEAkKAEAkKAAAkaAAAESCAgAQCQoAQCQoAACRoAAARIICABAJCgBAJCgAAJGgAABEggIAEAkKAEAkKAAAkaAAAESCAgAQCQoAQCQoAACRoAAARIICABAJCgBAJCgAAJGgAABEggIAEAkKAEAkKAAAkaAAAESCAgAQCQoAQCQoAACRoAAARIICABAJCgBAJCgAAJGgAABEggIAEAkKAEAkKAAAkaAAAESCAgAQCQoAQCQoAACRoAAARIICABAJCgBAJCgAAJGgAABEggIAEAkKAEAkKAAAkaAAAESCAgAQCQoAQCQoAACRoAAARIICABAJCgBAJCgAAJGgAABEggIAEAkKAEAwTf8D2Splhg4VB1YAAAAASUVORK5CYII=" alt="" />

想起刚上大学那会大家在网上搜免费的QQ空间主题js代码的经历，感觉突破口就是它了。稍稍问了一下度姑娘，还真找到了解决方案，总结如下：

1、添加object标签

既然说支持HTML代码，那灵活度就大了，找到这个酷炫的Flash时钟swf资源的URI，设定一下object的标签属性即可，上代码：

 <object width="200" height="75" data="http://files.cnblogs.com/arthurymn/honehone_clock_wh.swf" type="application/x-shockwave-flash">
   <param name="src" value="http://files.cnblogs.com/arthurymn/honehone_clock_wh.swf" />
 </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="' + 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一如既往的高效啊，向高效率精神致敬！）

纯业余整理，若有解释不当之处，欢迎指正:)