ルーレット形式で文字が変わる実装を作りたいです

前提・実現したいこと

ルーレット形式で文字が変わる実装を作りたいです
１１１１の部分がスタートを押したら用意していた文字にランダムで動いて
ストップで止めることができる仕様にしたいです。

該当のソースコード

html
1ソース <div class="left-bar-header">
2</div>
3
4<div class="rooms">
5
6 <div id="roulette">
7    <p id="isPlace">11111</p>
8  </div>
9
10  <div class="buttons">
11    <button id="start" onClick="clickedStart()">start</button>
12    <button id="stop" onClick="clickedStop()">stop</button>
13  </div>
14
15</div>
16   
17
18ここにより詳細な情報を記載してください。

m.ts10806

2020/10/09 22:08

コードやエラーはマークダウンのcode機能を利用してご提示ください。 https://teratail.com/questions/238564 あと「ここから先は作ってください」という作業依頼になってませんか？何一つ書けないのでしたらそのままのコードをもらったとして自分の身にはなりません。

firegrape

2020/10/10 01:17

スロットみたいにしたいってことですか？

行動規範の内容に同意します

回答1件

ベストアンサー

どうぞ

サンプル

js
1const 用意していた文字 = ["用意していた文字1","用意していた文字2"];
2let timer;
3
4var clickedStart = ()=> timer = setInterval(
5  ()=> isPlace.textContent = 用意していた文字[ Math.floor( Math.random() * 用意していた文字.length ) ],
6  100
7);
8
9var clickedStop= ()=> clearInterval( timer );