fullpage:插件简单介绍
fullPage.js 是一个基于 jQuery 的插件，它能够很方便、很轻松的制作出全屏网站。
主要功能有：支持鼠标滚动 ,支持前进后退和键盘控制,多个回调函数,支持手机、平板触摸事件,支持 CSS3 动画,支持窗口缩放,窗口缩放时自动调整,可设置滚动宽度、背景颜色、滚动速度、循环选项、回调、文本对齐方式等等
字体图标的引用方法
要在文件中嵌入自定义的字体图标，首先在工程目录中创建font文件夹，里面用来存放四种格式的字体：
xxx.eot
xxx.svg
xxx.ttf
xxx.woff
在CSS中配置字体：
@font-face{
font-family: fontName;
src: url('/font/xxx.eot') format('embedded-opentype'),
url('/font/xxx.svg') format('svg'),
url('/font/xxx.ttf') format('truetype'),
url('/font/xxx.woff') format('woff');
}
在CSS中配置选择器：
[class^="icon-"],
[class*="icon-"]{
font-family: fontName;
font-style: normal;
}
[class^="className-"]：匹配class属性中第一个以“className-”为前缀的DOM节点样式，如匹配：
<div class="className-text"></div>
<div class="className-next"></div>
[class*="className-"]：匹配class属性中非第一个以“className-”为前缀的DOM节点样式，如匹配：
<div class="box className-text"></div>
<div class="top_bar className-next"></div>
两个匹配符联合写出之后，效果就是匹配class中有以“className-”为前缀的DOM节点样式
在HTML文本中嵌入字体：
<i class="icon-iconName"></i>
在HTML中嵌入文本字体一般用<i>标签，class中标注前缀为“icon-”，如：
<div>
<i class="icon-phone"></i>
<span>888-888-8888</span>
</div>
在CSS中设置<i>标签：
.icon-iconName::before{
content: '\iconcode';
font-size: 16px;
}
将标签设置为::before(或::after)，同时设置其中的content内容和字体大小，content内容为字体官网提供的字体编码，如：
.icon-phone::before{
content: '\f11c';
font-size: 20px;
}
Demo(基于Material Design Icon):
HTML
<div>
<i class="icon-phone"></i>
<span>888-888-8888</span>
</div>
CSS
@font-face {
font-family: md;
src: url('materialdesignicons-webfont.eot') format('embedded-opentype'),
url('materialdesignicons-webfont.svg') format('svg'),
url('materialdesignicons-webfont.ttf') format('truetype'),
url('materialdesignicons-webfont.woff') format('woff');
}
[class^="icon-"],
[class*="icon-"] {
font-family: md;
font-style: normal;
}
.icon-phone::before{
content: '\f11c';
font-size: 20px;
}
用于移动端
1. zepoto.js 轻量级移动端类库，里面有封装tap、swipe事件，类似jquery.js,引用后可用jquery，也可以引用jquery压缩版 http://www.zeptojs.cn/#contents
2. touch.js 移动端触摸事件库，zepto的tap事件可能在某些情况下会出问题，所以用touch.js,使用时参考文档库：http://www.cnblogs.com/Chen-XiaoJun/articles/5826698.html 有拖拽、滑动、旋转等 现成的效果
3. hammar.js 类似touch.js
4.fastclick.js 解决click的300ms的延迟和点透bug，通常用tap做点击事件，使用参考：
http://blog.csdn.net/zfy865628361/article/details/49512095
5. annimate.css 动画库 里面定义了一些常用的css动画。 移动端很吃性能，避免频繁操作dom，所以用css3的动画、过度等，性能好，使用时直接加animated和动画的类名即可。
https://daneden.github.io/animate.css/
6. swiper.js 移动端触摸滑动插件，做轮播效果 ，效果以及使用参考: http://www.swiper.com.cn/
7.iscroll-4插件 解决web-app中区域滚动问题，滑动时有惯性运动，本质：利用css3属性让dom运动
http://www.360doc.com/content/14/0724/11/16276861_396699901.shtml