Jquery使用animate实现css3的平移动画效果

 Jquery使用animate实现css3的平移动画效果

实现效果：

首先，Jquery并不支持在animate的样式中的transform效果，这里通过使用animate的回调函数来实现。

	position: fixed;
	bottom: 40%;
	right:220px;
	/*display: inline-block;*/
	display: none;
	width:40px;
	height:180px;
	line-height:35.6px;
	background:linear-gradient(225deg,rgba(213,242,22,1) 0%,rgba(147,255,30,1) 100%);
	border-radius:10px 0px 0px 10px;
	z-index: 43253;
	transition: all 1s

 

$("#member_order_list_btn").find(".member_order_btn_img").attr("src","/v2/img/member_order_list_btn_right02.png");
            $("#member_order_list_btn").animate({},function(){                                       //第一个花括号里面是动画内容，可以为空，但不能省去中括号
                $("#member_order_list_btn").css({"right":"220px"});                                   //在回调函数里面改变css属性来实现transform中的动画变换
            })