這是一款基于jquery實現的漫天雪花飛舞的圣誕祝福雪花效果代碼,雪花的大小可以進行切換,用戶還可以更改背景圖片,是一款非常實用的幻燈片特效源碼。
漫天雪花飛舞的jquery圣誕祝福雪花效果,集中不同的效果可以點擊選擇,請欣賞。
效果演示 源碼下載(瀏覽器中如果不能正常運行,可以嘗試切換瀏覽模式或者選擇直接下載)
為大家分享的漫天雪花飛舞的jquery圣誕祝福雪花效果代碼如下
<!DOCTYPE html><html><head> <script type="text/javascript" src="images/jquery-latest.min.js"></script> <script src='images/snowfall.jquery.js'></script> <link rel="stylesheet" href="images/styles.css"></link></head><body class="darkBg"> <input type="button" id="clear" value="Click to clear"/> <input type="button" id="round" value="Rounded"/> <input type="button" id="shadows" value="Shadows"/> <input type="button" id="roundshadows" value="Rounded Shadows"/> <input type="button" id="deviceorientation" value="Deviceorientation"/> <div class="collectonme"> <p>Collect on meeeeee!!!</p> </div> <div class="collectonme"> <p>Collect on meeeeee!!!</p> </div> <div class="collectonme"> <p>Collect on meeeeee!!!</p> </div></body> <script type='text/javascript'> $(document).ready(function(){ $('.collectonme').hide(); //Start the snow default options you can also make it snow in certain elements, etc. $(document).snowfall(); $("#clear").click(function(){ $(document).snowfall('clear'); // How you clear }); $("#round").click(function(){ document.body.className = "darkBg"; $('.collectonme').hide(); $(document).snowfall('clear'); $(document).snowfall({round : true, minSize: 5, maxSize:8}); // add rounded }); $("#shadows").click(function(){ document.body.className = "lightBg"; $('.collectonme').hide(); $(document).snowfall('clear'); $(document).snowfall({shadow : true, flakeCount:200}); // add shadows }); $("#roundshadows").click(function(){ document.body.className = "lightBg"; $('.collectonme').hide(); $(document).snowfall('clear'); $(document).snowfall({shadow : true, round : true, minSize: 5, maxSize:8}); // add shadows }); $("#deviceorientation").click(function(){ $(document).snowfall('clear'); $('.collectonme').hide(); document.body.className = "darkBg"; $(document).snowfall({deviceorientation : true, round : true, minSize: 5, maxSize:8}); }); }); </script><p align="center"><font color="#FFFFFF">來源:</font><a href="http://www.49028c.com/" target="_blank"><font color="#FFFFFF">武林網</font></a></p></html>
以上就是為大家分享的漫天雪花飛舞的jquery圣誕祝福雪花效果代碼,希望大家可以喜歡。
新聞熱點
疑難解答