dyfire / jquery-slotmachine

Makes Slot Machine effect in your html!

#jQuery-SlotMachine

A simple, lightweight jQuery plugin to make slot machine animation effect.

[Check the example page!] (http://josex2r.github.io/jQuery-SlotMachine/)

Installation

Install the component using Bower:

$ bower install jquery-slotmachine --save

Include the script located in dist folder after the jQuery library:

<script src="/path/to/jquery.slotmachine.min.js"></script>

Usage

Creating the machine:

var machine = $(foo).slotMachine( params );

Shuffle:

machine.shuffle( repeat, onStopCallback ); //No args to make rotate infinitely

Change the selected element:

machine.prev(); //Previous element

machine.next(); //Next element

Get selected element:

machine.active; //Current element index

Get the next selected element:

machine.futureActive; //Future active element index

Check if the machine is running:

machine.isRunning; //Returns boolean

Change spin result, if the returned value is out of bounds, the element will be randomly choosen:

machine.setRandomize(foo); //foo must be a function (should return int) or an int

Params

Params must be an object, optionally containing the next parammeters:

active

Set the first element

active: 0

delay

Set spin animation time

delay: 200

auto

Pass an int as miliseconds to make the machine auto rotate

repeat: false

stopHidden (currently disabled)

Stop animation if the element is above or below the screen

stopHidden: true

randomize

Pass a function to select your own random element. This function must return an integer between 0 (first element) and max number of elements.

randomize: function(activeElementIndex){} //activeElementIndex = current selected index

Example (this machine always shows first element):

$('#foo').slotMachine({
	randomize : function(activeElementIndex){
		return 0;
	}
});

Authors

Jose Luis Represa

##License

jQuery-SlotMachine is released under the MIT License.