Init again on resize

[panconjugo]

Is there a way to initialize again the machine when the window is resized? I was playing around with this nice plugin but just realized when on resize, then the machine stops in between 2 items.

[kvanderloock-site-works]

I found some kind of workaround for this.

First i added a "resetInit" function the the createClass Array, its basicly calling the init again but destroys the slotmachine before.

{ key: "resetInit", value: function resetInit(element, options) { this.destroy(); _classCallCheck(this, SlotMachine); this.element = element; // Slot Machine elements this.tiles = [].slice.call(this.element.children); // Machine is running? this.running = false; // Machine is stopping? this.stopping = false; // Disable overflow this.element.style.overflow = 'hidden'; // Wrap elements inside container this._wrapTiles(); // Set min top offset this._minTop = -this._fakeFirstTile.offsetHeight; // Set max top offset this._maxTop = -this.tiles.reduce(function (acc, tile) { return acc + tile.offsetHeight; }, 0); // Call setters if neccesary this.changeSettings(Object.assign({}, defaults, options)); // Initialize spin direction [up, down] this._setBounds(); // Show active element this._resetPosition(); // Start auto animation if (this.auto !== false) { this.run(); } } }

After this i created a js function that calls the new function on window resize:

$( window ).resize(function() { machine1.resetInit(el1, { active: machine1._active }); machine2.resetInit(el2, { active: machine2._active }); machine3.resetInit(el3, { active: machine3._active }); });

I know it's now calling the resetIni everytime the window is resized but for me this worked for the moment.