Html5添加超有趣的白云飘动特效插件教程

1、安装
bower install jqlouds --save

2、使用方法
<script src="jquery.js"></script>
<script src="dist/jquery.jqlouds.min.js"></script>
<div id="sky"></div>
$('#sky1, #sky2').jQlouds();      
 
3、设置天空的高度
(1)CSS
<div id="sky" style="height:223px;"></div>
<script>
jQuery(function($) {
$('#sky').jQlouds();
});
</script>

(2)JS
<div id="sky"></div>
<script>
jQuery(function($) {
$('#sky').jQlouds({ skyHeight: 223 });
});
</script>

4、白云飘动动画
$('#sky').jQlouds({
wind: true
});

5、云朵的数量
$('#sky').jQlouds({
minClouds: 5,
maxClouds: 10
});

6、最大云朵的尺寸
$('#sky').jQlouds({
maxWidth: 113,
maxHeight: 48,
});

7、自定义云朵
$('#sky').jQlouds({
src: 'path/to/image.png',
});

8、配置参数
options={
src: 'images/cloud.png',
maxWidth: 227,
maxHeight: 96,
minClouds: 20,
maxClouds: 30,
skyHeight: null,
wind: false
};
$('#sky').jQlouds(options);  

KeyMob移动端广告平台是最专业最具备效果的移动广告平台，致力于为广告主提供精准高效的品牌与应用推广服务，同时为应用开发者提供稳定的SDK以及高收入的收益。