CSS3 实现的动态边框效果 live boder

最近 Google+ 进行了改版，整体效果如何我就不吐槽了.

有些设计上的细节比较有意思，比如这个后台载入的提示:

通过开发者工具分析可以看出来，它是通过 CSS3 animation 让一个 div 循环移动实现的

于是我也来尝试实现了一下这个效果，并封装成 jQuery 插件，

通过举一反三，还可以实现动态环绕的边框效果：

目前的封装很简单，使用起来也很简单(依赖 jQuery)

• 引入相关文件

  <link rel="stylesheet" href="live-border.css"/><script type="text/javascript" src="live-border.js"></script>

• 初始化

  $("#id-btn1").liveBorder();
  $("#id-btn2").liveBorder({
  top: true,
  right: true,
  bottom: true,
  left: true
  });

  

  https://github.com/z4none/jquery-live-border/