You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

4 lines
5.0 KiB

  1. /*! flip - v1.1.2 - 2016-10-20
  2. * https://github.com/nnattawat/flip
  3. * Copyright (c) 2016 Nattawat Nonsung; Licensed MIT */(function(n){var h=function(){var e,t=document.createElement("fakeelement"),i={transition:"transitionend",OTransition:"oTransitionEnd",MozTransition:"transitionend",WebkitTransition:"webkitTransitionEnd"};for(e in i)if(t.style[e]!==void 0)return i[e]},o=function(e,t,i){this.setting={axis:"y",reverse:!1,trigger:"click",speed:500,forceHeight:!1,forceWidth:!1,autoSize:!0,front:".front",back:".back"},this.setting=n.extend(this.setting,t),typeof t.axis=="string"&&(t.axis.toLowerCase()==="x"||t.axis.toLowerCase()==="y")&&(this.setting.axis=t.axis.toLowerCase()),typeof t.reverse=="boolean"&&(this.setting.reverse=t.reverse),typeof t.trigger=="string"&&(this.setting.trigger=t.trigger.toLowerCase());var s=parseInt(t.speed);isNaN(s)||(this.setting.speed=s),typeof t.forceHeight=="boolean"&&(this.setting.forceHeight=t.forceHeight),typeof t.forceWidth=="boolean"&&(this.setting.forceWidth=t.forceWidth),typeof t.autoSize=="boolean"&&(this.setting.autoSize=t.autoSize),(typeof t.front=="string"||t.front instanceof n)&&(this.setting.front=t.front),(typeof t.back=="string"||t.back instanceof n)&&(this.setting.back=t.back),this.element=e,this.frontElement=this.getFrontElement(),this.backElement=this.getBackElement(),this.isFlipped=!1,this.init(i)};n.extend(o.prototype,{flipDone:function(e){var t=this;t.element.one(h(),function(){t.element.trigger("flip:done"),typeof e=="function"&&e.call(t.element)})},flip:function(e){if(!this.isFlipped){this.isFlipped=!0;var t="rotate"+this.setting.axis;this.frontElement.css({transform:t+(this.setting.reverse?"(-180deg)":"(180deg)"),"z-index":"0"}),this.backElement.css({transform:t+"(0deg)","z-index":"1"}),this.flipDone(e)}},unflip:function(e){if(this.isFlipped){this.isFlipped=!1;var t="rotate"+this.setting.axis;this.frontElement.css({transform:t+"(0deg)","z-index":"1"}),this.backElement.css({transform:t+(this.setting.reverse?"(180deg)":"(-180deg)"),"z-index":"0"}),this.flipDone(e)}},getFrontElement:function(){return this.setting.front instanceof n?this.setting.front:this.element.find(this.setting.front)},getBackElement:function(){return this.setting.back instanceof n?this.setting.back:this.element.find(this.setting.back)},init:function(e){var t=this,i=t.frontElement.add(t.backElement),s="rotate"+t.setting.axis,r=t.element["outer"+(s==="rotatex"?"Height":"Width")]()*2,f={perspective:r,position:"relative"},a={transform:s+"("+(t.setting.reverse?"180deg":"-180deg")+")","z-index":"0",position:"relative"},l={"backface-visibility":"hidden","transform-style":"preserve-3d",position:"absolute","z-index":"1"};t.setting.forceHeight?i.outerHeight(t.element.height()):t.setting.autoSize&&(l.height="100%"),t.setting.forceWidth?i.outerWidth(t.element.width()):t.setting.autoSize&&(l.width="100%"),(window.chrome||window.Intl&&Intl.v8BreakIterator)&&"CSS"in window&&(f["-webkit-transform-style"]="preserve-3d"),i.css(l).find("*").css({"backface-visibility":"hidden"}),t.element.css(f),t.backElement.css(a),setTimeout(function(){var d=t.setting.speed/1e3||.5;i.css({transition:"all "+d+"s ease-out"}),typeof e=="function"&&e.call(t.element)},20),t.attachEvents()},clickHandler:function(e){e||(e=window.event),!this.element.find(n(e.target).closest('button, a, input[type="submit"]')).length&&(this.isFlipped?this.unflip():this.flip())},hoverHandler:function(){var e=this;e.element.off("mouseleave.flip"),e.flip(),setTimeout(function(){e.element.on("mouseleave.flip",n.proxy(e.unflip,e)),e.element.is(":hover")||e.unflip()},e.setting.speed+150)},attachEvents:function(){var e=this;e.setting.trigger==="click"?e.element.on(n.fn.tap?"tap.flip":"click.flip",n.proxy(e.clickHandler,e)):e.setting.trigger==="hover"&&(e.element.on("mouseenter.flip",n.proxy(e.hoverHandler,e)),e.element.on("mouseleave.flip",n.proxy(e.unflip,e)))},flipChanged:function(e){this.element.trigger("flip:change"),typeof e=="function"&&e.call(this.element)},changeSettings:function(e,t){var i=this,s=!1;if(e.axis!==void 0&&i.setting.axis!==e.axis.toLowerCase()&&(i.setting.axis=e.axis.toLowerCase(),s=!0),e.reverse!==void 0&&i.setting.reverse!==e.reverse&&(i.setting.reverse=e.reverse,s=!0),s){var r=i.frontElement.add(i.backElement),f=r.css(["transition-property","transition-timing-function","transition-duration","transition-delay"]);r.css({transition:"none"});var a="rotate"+i.setting.axis;i.isFlipped?i.frontElement.css({transform:a+(i.setting.reverse?"(-180deg)":"(180deg)"),"z-index":"0"}):i.backElement.css({transform:a+(i.setting.reverse?"(180deg)":"(-180deg)"),"z-index":"0"}),setTimeout(function(){r.css(f),i.flipChanged(t)},0)}else i.flipChanged(t)}}),n.fn.flip=function(e,t){return typeof e=="function"&&(t=e),typeof e=="string"||typeof e=="boolean"?this.each(function(){var i=n(this).data("flip-model");e==="toggle"&&(e=!i.isFlipped),e?i.flip(t):i.unflip(t)}):this.each(function(){if(n(this).data("flip-model")){var i=n(this).data("flip-model");e&&(e.axis!==void 0||e.reverse!==void 0)&&i.changeSettings(e,t)}else n(this).data("flip-model",new o(n(this),e||{},t))}),this}})(jQuery);