中文字幕av专区_日韩电影在线播放_精品国产精品久久一区免费式_av在线免费观看网站

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

jQuery實現web頁面櫻花墜落的特效

發布時間:2020-09-25 09:40:53 來源:腳本之家 閱讀:129 作者:惠惠_ 欄目:web開發

源碼地址

https://github.com/jingegebuguai/Cherry_Blossoms(求star)

開發原因

  • 上課看到一位女生桌面背景是一課櫻花樹,頓時產生了一個讓櫻花可以在web頁面飛舞的想法,借此把這個插件獻送給那位女同學;
  • 開發過焦點圖,輪轉圖,瀑布流等應用插件,但是這類型插件還是第一次做,那個啥興趣使然對吧;

開發工具

  • Jquery+webstorm,無需額外配置任何環境,移動端無法使用

效果演示

為了更加顯眼,背景換成了黑色,gif圖有些卡頓,實際效果比較流暢

效果詳見Github

使用方法

  • 在需要加入效果的頁面加入html代碼,位置最好放在body元素下第一個標簽
<div class="cherry">
<img id="yinghua" src="../image/yinghua.png" alt="" >
</div>
  • 導入一下js代碼其中各變量可根據需要改變
$(function(){
   $('.cherry').Cherry_Blossoms({
     is_Cherry:true,//是否生成櫻花
     image_min:10,//花瓣最小寬度和高度
     image_max:50,//花瓣最大寬度和高度
     time_min:10000,//花瓣最快下墜時間
     time_max:20000,//花瓣最慢下墜時間
     interval:500//花瓣生成時間間隔
   })
 })

js插件

  • IIFE(立即執行匿名函數)
  • $.extend(),擴展插件定義默認參數
  • randomNum()設置[m,n]類型隨機數

以上所述是小編給大家介紹的jQuery實現web頁面櫻花墜落的特效,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對億速云網站的支持!

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

和平县| 建平县| 普格县| 六枝特区| 太仆寺旗| 保定市| 马关县| 固原市| 虹口区| 额济纳旗| 孝感市| 灵宝市| 舒城县| 尤溪县| 晋城| 崇左市| 富阳市| 肃宁县| 横峰县| 绥芬河市| 贡山| 茶陵县| 太原市| 绥德县| 连云港市| 灵寿县| 彭泽县| 双流县| 陕西省| 岳普湖县| 漳平市| 林周县| 宜良县| 石渠县| 施甸县| 广州市| 罗定市| 孟州市| 武夷山市| 宿迁市| 桐梓县|