diff --git a/README.md b/README.md index 4bca0e6..b03d28b 100644 --- a/README.md +++ b/README.md @@ -21,14 +21,14 @@ Usage 2. Encapsulate your rotating words in an element and separate each word with a comma or a separator of your choice: - I am a So Simple, Very Doge, Much Wow, Such Cool Text Rotator + I am a So Simple, Very Doge, Much Wow, Such Cool Text Rotator 3. Trigger the plugin by calling Morphext() on the element containing the rotating words: $("#js-rotating").Morphext({ - animation: "bounceIn", // Animation type (refer to Animate.css for a list of available animations) - separator: ",", // An array of words to rotate are created based on this separator. Change it if you wish to separate the words differently (e.g. So Simple | Very Doge | Much Wow | Such Cool) - speed: 2000 // The delay between each word in milliseconds + animation: "bounceIn", // Animation type (refer to Animate.css for a list of available animations) + separator: ",", // An array of words to rotate are created based on this separator. Change it if you wish to separate the words differently (e.g. So Simple | Very Doge | Much Wow | Such Cool) + speed: 2000 // The delay between each word in milliseconds }); diff --git a/example.html b/example.html index c3f5b94..af9981b 100644 --- a/example.html +++ b/example.html @@ -11,8 +11,8 @@
- I am a So Simple, Very Doge, Much Wow, Such Cool Text Rotator -
+ I am a So Simple, Very Doge, Much Wow, Such Cool Text Rotator + diff --git a/morphext.css b/morphext.css index b0c54e0..07c40b5 100644 --- a/morphext.css +++ b/morphext.css @@ -1,3 +1,3 @@ .animated { - display: inline-block; + display: inline-block; } \ No newline at end of file diff --git a/morphext.js b/morphext.js index c36639f..947b01c 100644 --- a/morphext.js +++ b/morphext.js @@ -10,64 +10,64 @@ * http://ian.mit-license.org/ */ ;(function ($, window, document, undefined) { - var pluginName = "Morphext", - defaults = { - animation: "bounceIn", - separator: ",", - speed: 2000 - }; + var pluginName = "Morphext", + defaults = { + animation: "bounceIn", + separator: ",", + speed: 2000 + }; - function Plugin (element, options) { - this.element = $(element); - - this.settings = $.extend({}, defaults, options); - this._defaults = defaults; - this._name = pluginName; - this.init(); - } + function Plugin (element, options) { + this.element = $(element); + + this.settings = $.extend({}, defaults, options); + this._defaults = defaults; + this._name = pluginName; + this.init(); + } - Plugin.prototype = { - init: function () { - var $that = this; - this.phrases = []; + Plugin.prototype = { + init: function () { + var $that = this; + this.phrases = []; - $.each(this.element.text().split(this.settings.separator), function (key, value) { - $that.phrases.push(value); - }); + $.each(this.element.text().split(this.settings.separator), function (key, value) { + $that.phrases.push(value); + }); - this.current = this.phrases[0]; + this.current = this.phrases[0]; - this.animate(); + this.animate(); - setInterval(function () { - $that.animate(); - }, this.settings.speed); - }, - animate: function () { - this._reset(); + setInterval(function () { + $that.animate(); + }, this.settings.speed); + }, + animate: function () { + this._reset(); - if (typeof this.next !== "undefined" && this.next !== null) - this.current = this.next; + if (typeof this.next !== "undefined" && this.next !== null) + this.current = this.next; - this.index = $.inArray(this.current, this.phrases); - if ((this.index + 1) == this.phrases.length) // Loop - this.index = -1; + this.index = $.inArray(this.current, this.phrases); + if ((this.index + 1) == this.phrases.length) // Loop + this.index = -1; - this.next = this.phrases[this.index + 1]; + this.next = this.phrases[this.index + 1]; - $("" + this.current + "") - .appendTo(this.element); - }, - _reset: function () { - this.element.html(''); - } - }; + $("" + this.current + "") + .appendTo(this.element); + }, + _reset: function () { + this.element.html(''); + } + }; - $.fn[pluginName] = function (options) { - return this.each(function() { - if (!$.data(this, "plugin_" + pluginName)) { - $.data(this, "plugin_" + pluginName, new Plugin(this, options)); - } - }); - }; + $.fn[pluginName] = function (options) { + return this.each(function() { + if (!$.data(this, "plugin_" + pluginName)) { + $.data(this, "plugin_" + pluginName, new Plugin(this, options)); + } + }); + }; })(jQuery, window, document); \ No newline at end of file