axure 水波点击_自定义Axure的JS和CSS以实现Material Design的波浪特效

最近在写一个全新的谷歌材料设计 Material Design风格的WEB产品，在开发过程中将产品原型做成了Axure元件库，当然目前没有完全完成。本文将以实现谷歌材料设计按钮的波浪效果为例，提供一种新的自定义Axure的样式的方法

需要说明的是，本文所提供的方式已经最大程度小白式，简单易用，但是对于产品经理来说，本文的教程可能不具有实际的意义，仅提供给喜欢研究Axure Or Code的玩家。

视频

网页

实现原理

1.波浪效果的实现需要特定的CSS和JS文件，但是在Axure里我们并不能直接Code

2.Axure提供了当前窗口打开链接的接口，通过这个接口可以直接加载Javascript,它提供了Axure和前端代码直接交互的能力，正因为这样Axure在前端样式和交互上有了更加广阔的扩展空间，所以我们可以将外部CSS或JS文件放到Javascript中，通过在页面载入的时候添加用例:当前窗口打开链接来加载外部CSS或JS：

在打开链接处JS代码格式为：

javascript:需要执行的代码;

最终实现

1.首先，你需要将如下代码添加到：用例-页面载入时-打开链接-当前窗口-链接到URL或文件-超链接处。

如果你会Code可以自己修改加载的JS和CSS来修改效果…

其中$("").attr({ rel: "stylesheet",type: &#