快速添加一个奇妙的动态散景效果页面使用这个简单的使用jQuery插件。从全屏幕背景效果更微妙的影响增加运动和兴趣这个插件可以帮助你与你的需求。
相关代码
<script src="resources/js/jquery-2.1.0.min.js"></script>
<script src="resources/js/jquery.browser.min.js"></script>
<script src="resources/js/jquery.dynamicBokeh.js"></script>
<script src="resources/js/idangerous.swiper-2.1.min.js"></script>
<script>
var mySwiper = new Swiper('.swiper-container',{
grabCursor: true
});
$('#giftLink').on('click',function(event){
mySwiper.swipeTo(0, 700, true);
});
$('#eventLink').on('click',function(event){
mySwiper.swipeTo(1, 700, true);
});
$('#menuLink').on('click',function(event){
mySwiper.swipeTo(2, 700, true);
});
var options= {};
options.quantity = 20;
options.minDuration = 2;
options.maxDuration = 10;
//options.colors = [{color:'EDF7FF'},{color:'210f43'}];
$('#background').dynamicBokeh(options);
options.colors = [{color:'e1bf58'},{color:'986830'}];
$('#slide1_inner').dynamicBokeh(options);
options.colors = [{color:'f12096'},{color:'ea89c0'},{color:'f9cee6'}];
options.minDuration = 3;
options.maxDuration = 8;
options.quantity = 30;
$('#slide2_inner').dynamicBokeh(options);
options.quantity = 10;
options.minSize = 45;
options.maxSize = 60;
options.colors = [{color:'96a5c4'},{color:'83588d'},{color:'230f42'}];
$('#slide3_inner').dynamicBokeh(options);
</script>