欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

jQuery 插件實現(xiàn)隨機自由彈跳氣泡樣式

 更新時間:2017年01月12日 11:37:58   投稿:mrr  
一個基于jQuery的氣泡動畫插件,在指定區(qū)域上方(左/右)定時間隔產生氣泡,然后隨機水平速度進行仿自由落體運動。這篇文章主要介紹了jQuery 插件實現(xiàn)隨機自由彈跳氣泡樣式的相關資料,需要的朋友可以參考下

一個基于jQuery的氣泡動畫插件,在指定區(qū)域上方(左/右)定時間隔產生氣泡,然后隨機水平速度進行仿自由落體運動。到達區(qū)域底部之后做彈跳運動,速度逐漸衰減。直至停止運動。

在線演示

安裝方法

由于是基于jQuery的擴展插件,因此引入jQuery是必須的。

此外,還需引入插件自身的實現(xiàn)腳本。

<scriptsrc="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<scriptsrc="../js/jquery.bubble.min.js"></script>

在此之前,我們還需要引入樣式依賴文件 jquery.bubble.min.css ,主要包含氣泡自身基礎樣式。

<link rel="stylesheet" href="../css/jquery.bubble.min.css">

使用示例

插件會在指定的元素范圍內運行,如果找不到指定的元素,插件將以body元素作為容器。

$(function(){
  $('#J_PluginWrap').bubble({
    // 氣泡元素Class
    itemClass: 'J_BubbleItem',
    // 氣泡大小范圍[最小值, 最大值],單位px
    size: [60, 120],
    // 氣泡吹大時間范圍[最小值, 最大值],單位s
    blowTime: [0.5, 1],
    // 氣泡出現(xiàn)的方向,left/right
    direction: 'right',
    // 位置偏移量,[x, y],效果與 direction 相關
    offset: [0, 60],
    // 氣泡產生時間間隔,單位s
    interval: 1.2,
    // 自動停止的時間,為0則不停止,單位s
    autoStop: 10
  });
});

更多詳細信息,請參看 源碼 。

以上所述是小編給大家介紹的jQuery 插件實現(xiàn)隨機自由彈跳氣泡樣式,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!

相關文章

最新評論