(function( $, undefined ) { //-----闭包,熟了不能再熟了
$.effects.effect.transfer = function( o, done ) {
var elem = $( this ),
target = $( o.to ), //最终移到到的目标元素
targetFixed = target.css( "position" ) === "fixed",
body = $("body"),
fixTop = targetFixed ? body.scrollTop() : 0,
fixLeft = targetFixed ? body.scrollLeft() : 0,
endPosition = target.offset(),
animation = {
top: endPosition.top - fixTop ,
left: endPosition.left - fixLeft ,
height: target.innerHeight(),
width: target.innerWidth()
},
startPosition = elem.offset(),
transfer = $( '<div class="ui-effects-transfer"></div>' ) //--------------构造动画元素
.appendTo( document.body )
.addClass( o.className )
.css({
top: startPosition.top - fixTop ,
left: startPosition.left - fixLeft ,
height: elem.innerHeight(),
width: elem.innerWidth(),
position: targetFixed ? "fixed" : "absolute" //---------------定位
})
.animate( animation, o.duration, o.easing, function() {
transfer.remove(); //--------------- 动画结束移除
done(); //---动画完成
});
};
})(jQuery);
jqueryui动画一窥之jquery.ui.effect-transfer.js
最新推荐文章于 2023-07-30 09:00:30 发布