I'm newbie and try to imitate this slot machine work, example 1: https://github.com/momokang/slotmachine
Before starting to spin, I set the max value of the slot machine (ex: 500) and then I press Spin button. The result was less or maybe equal the max value (029, 358, 500); but not more than 500 (ex: 506, 789, etc...)
Is it possible to do this?
Here's the source code: https://jsfiddle.net/c07gk6yq/
Html file:
<div class="container">
<div class="slotwrapper" id="example1">
<ul>
<li>0</li>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li class="text-danger">9</li>
</ul>
<ul>
<li>0</li>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li class="text-danger">9</li>
</ul>
<ul>
<li>0</li>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li class="text-danger">9</li>
</ul>
</div>
<div >
<button type="button" class="btn btn-success btn-lg" id="btn-example1">Spin</button>
</div>
<div class="collapse" id="collapse-example1">
<div class="well">
<code>
$('#btn-example1').click(function() {<br/>
$('#example1 ul').playSpin();<br/>
});
</code>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="js/slotmachine.min.js"></script>
<script type="text/javascript">
$('#btn-example1').click(function() {
$('#example1 ul').playSpin();
});
</script>