抹桥的博客

第一题：请使用Javascript实现以下动态效果

可以使用任何你喜欢的方式和库，尽量使用你认为优雅的实现，并在代码完成说简要说明此方案的优点和不足。
这是我用原生js实现的，用到了input标签的readonly属性，实现如下：

前言

终于搞定了一个电商整站临摹，共四张页面，实现了基本的交互功能，同时也应用了less这个新学的css预处理语言。之前也做过一个电商首页点这儿。但是因为只是单页面，处理起来比较简单。但是在制作这个整站的过程中，更加深刻的理解一些之前学过的内容：比如样式结构的分离，js设计时的分层思想等。点击这里查看网页效果，或者下面有效果图(图好丑)：

众所周知，onedrive是微软提供的一款个人网络硬盘，对老用户提供25GB的免费空间，新注册用户提供7GB的空间，要是这个空间可以用来做博客的图床就太好不过了。毕竟微软这么一个财大气粗的公司，而且在国内也不会随随便便就被墙掉，所以稳定性有保证。但是onedrive提供的公开链接并不能直接插入博客，需要做一定的格式转换才可以。在网上找到了转换连接的办法，但是要是手动转换，太麻烦了，于是想着做一个chrome扩展，毕竟方便嘛。

花了两天时间，总算把博客搭起来了。期间碰到了很多问题，还好有伟大的Google，也都一一化解。现将其间过程写下来，也好帮助像我一样需要帮助的人。

幽灵按钮最近很流行，就寻思着做了一个，它有如下一些效果。