buttons.js
1.4 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
(function ($) {
$(document).ready(function() {
// jQuery reverse
$.fn.reverse = [].reverse;
$(document).on('mouseenter.fixedActionBtn', '.fixed-action-btn', function(e) {
var $this = $(this);
openFABMenu($this);
});
$(document).on('mouseleave.fixedActionBtn', '.fixed-action-btn', function(e) {
var $this = $(this);
closeFABMenu($this);
});
});
$.fn.extend({
openFAB: function() {
var $this = $(this);
openFABMenu($this);
},
closeFAB: function() {
closeFABMenu($this);
}
});
var openFABMenu = function (btn) {
$this = btn;
if ($this.hasClass('active') === false) {
$this.addClass('active');
$this.find('ul .btn-floating').velocity(
{ scaleY: ".4", scaleX: ".4", translateY: "40px"},
{ duration: 0 });
var time = 0;
$this.find('ul .btn-floating').reverse().each(function () {
$(this).velocity(
{ opacity: "1", scaleX: "1", scaleY: "1", translateY: "0"},
{ duration: 80, delay: time });
time += 40;
});
}
};
var closeFABMenu = function (btn) {
$this = btn;
$this.removeClass('active');
var time = 0;
$this.find('ul .btn-floating').velocity("stop", true);
$this.find('ul .btn-floating').velocity(
{ opacity: "0", scaleX: ".4", scaleY: ".4", translateY: "40px"},
{ duration: 80 }
);
};
}( jQuery ));