JSFiddle - React, Tailwind, and code Playground
by kiraxe
JavaScript
;(function ( $, window, document, undefined ) {
var pluginName = 'ObjectAnimation',
defaults = {
'scrollStart' : 0,
'scrollEnd': 0,
'degreeActivate' : false,
'degree' : 45,
'rotateStart' : 0,
'clockwise' : true,
'scaleActivate' : false,
'scaleStart' : 1.5,
'scaleEnd' : 2.5,
'pathActivate' : false,
'pathStartY' : 1,
'pathStartX' : 1,
'pathEndY' : 0,
'pathEndX' : 0,
};
function ObjectAnimation( element, options ) {
this.element = element;
this.options = $.extend( {}, defaults, options) ;
this._defaults = defaults;
this._name = pluginName;
this.init();
}
ObjectAnimation.prototype.init = function () {
// Тут пишем код самого плагина
// Здесь у нас уже есть доступ к DOM, и входным параметрам
// через объект, типа this.element и this.options
this.scrollOn();
};
ObjectAnimation.prototype.getSin = function(degree){
var radian = degree * (Math.PI / 180);
var sin = Math.sin(radian);
return sin;
};
ObjectAnimation.prototype.getCos = function(degree) {
var radian = degree * (Math.PI / 180);
var cos = Math.cos(radian);
return cos;
};
ObjectAnimation.prototype.getOpacityDivider = function() {
var opacityDivider = this.options.scrollEnd * 2;
return opacityDivider;
};
ObjectAnimation.prototype.getOpacity = function(scrollBottom) {
var opacity = scrollBottom * 2 / this.getOpacityDivider();
return opacity;
};
ObjectAnimation.prototype.getMatrix = function() {
var params = [];
var matrix = [];
params[0] = this.options.degreeActivate ? this.options.degree : 0;
params[1] = this.options.scaleActivate ? this.options.scaleStart : 1;
...