在今天的教程中，我们将使用jQuery开发一个单页面的网站，并且添加超酷的波浪动画背景效果到导航菜单上，希望大家能够喜欢！
主要开发使用插件：
- jQuery one page nav：用来生成单页面网站典型的滚动效果
- jQuery scrollTo.js：单页面插件依赖类库
- jQuery background position：用来生成动画背景效果
- jquery.animate-shadow-min.js：用来生成背景阴影效果
- jQuery easing 1.3.js：用来添加更多生成动画效果
- Cufon-yui.js：cufon类库，用来生成更加漂亮的字体
- fixie.js：用来辅助自动生成网站中的文字
本篇文章最后将生成一个单页面的网站设计，并且生成漂亮的动态导航按钮，调试环境firefox和Chrome，如果你使用其它的浏览器，可能无法工作。请自己调试。
如何生成按钮的背景波浪动画特效？
在这里，我们将使用动画背景图片来生成波浪的动画效果，在之前的“使用jQuery background-position插件来创建超酷的导航条效果教程”中，我们介绍过类似的实现效果，唯一不同的是，这里我们需要循环的移动背景图片，生成类似的波浪效果，相关图片如下：
这是一个png格式的波浪图片，我们使用jQuery动态的在按钮后挪动这个图片，生成对应的波浪效果。如果你需要实现更逼真的效果，可以我们生成俩个背景层来生成叠加效果，使用不同的透明度可以生成远近波浪效果。并且我们通过插件可以添加按钮的阴影效果。
单页面导航
单页面导航效果非常简单，请参考以前的教程：分享一个超棒的jQuery的单页面滚动导航设计插件
相关代码
生成波浪效果的javascript：
.............