jQuery右下角旋转环状菜单特效代码

jquery实现右下角旋转环形菜单特效代码，是固定在页面右下角位置，当用户点击了主菜单按钮后，子菜单项会以环状旋转进入页面，并使用animate.css制作动画效果。
效果图如下：

html代码：

<div class="htmleaf-container">

<div id='ss_menu'>

<div>

<i class="fa fa-qq"></i>

</div>

<div>

<i class="fa fa-weibo"></i>

</div>

<div>

<i class="fa fa-weixin"></i>

</div>

<div>

<i class="fa fa-renren"></i>

</div>

<div class='menu'>

<div class='share' id='ss_toggle' data-rot=''>

<div class='circle'></div>

<div class='bar'></div>

</div>

</div>

</div>

</div>

js代码：

$(document).ready(function (ev) {

var toggle = $('#ss_toggle');

var menu = $('#ss_menu');

var rot;
$('#ss_toggle').on('click', function (ev) {

rot = parseInt($(this).data('rot')) - 180;

menu.css('transform', 'rotate(' + rot + 'deg)');

menu.css('webkitTransform', 'rotate(' + rot + 'deg)');

if (rot / 180 % 2 == 0) {

toggle.parent().addClass('ss_active');

toggle.addClass('close');

} else {

toggle.parent().removeClass('ss_active');

toggle.removeClass('close');

}

$(this).data('rot', rot);

});

menu.on('transitionend webkitTransitionEnd oTransitionEnd', function () {

if (rot / 180 % 2 == 0) {

$('#ss_menu div i').addClass('ss_animate');

} else {

$('#ss_menu div i').removeClass('ss_animate');

}

});

});