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以及高收入的收益。