IT

웹 테트리스

엘리후 2021. 6. 26. 16:47

http://www.mins01.com/

 

공대여자 홈

공대여자 홈

www.mins01.com

<div class="gameBoxes">

<div class="gameBox text-center">

<div class="ttrbg-layout">

<div id="ttrbg" class="ttrbg" data-gaming="0" style="font-size: 32px;">

<div class="info-box">

​

<div class="textInfo textLevel">1</div>

<div class="textInfo textScore">0</div>

<div class="textInfo textRemovedBlocks">0</div>

<div class="textInfo textUsedTetriminoes">0</div>

​

<div class="ttrbg-grid next">

<div class="box box-next" data-color="0"></div><div class="box box-next" data-color="0"></div><div class="box box-next" data-color="0"></div><div class="box box-next" data-color="0"></div>

<div class="box box-next" data-color="0"></div><div class="box box-next" data-color="0"></div><div class="box box-next" data-color="0"></div><div class="box box-next" data-color="0"></div>

<div class="box box-next" data-color="0"></div><div class="box box-next" data-color="0"></div><div class="box box-next" data-color="0"></div><div class="box box-next" data-color="0"></div>

<div class="box box-next" data-color="0"></div><div class="box box-next" data-color="0"></div><div class="box box-next" data-color="0"></div><div class="box box-next" data-color="0"></div>

</div>

</div>

<div class="ttrbg-grid ready" style="grid-template-columns: repeat(10, 1fr); grid-template-rows: repeat(4, 1fr); width: 320px; height: 128px;"><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div><div class="box box-ready" data-moving="0" data-color="0"></div></div>

<div class="ttrbg-grid end" style="grid-template-columns: repeat(10, 1fr); grid-template-rows: repeat(20, 1fr); width: 320px; height: 640px;"><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div><div class="box box-end" data-moving="0" data-color="0"></div></div>

<div class="appear-box on">

<div class="appear-box-fence appear-box-item-center">

<div class="appear-box-content">Tetris Ready<br>10x20</div>

</div>

</div>

</div>

</div>

<div class="text-center">

<div class="input-group my-1 mx-auto" style="width:300px">

<div class="input-group-prepend">

<span class="input-group-text">Player1 key</span>

</div>

<select class="form-control" onchange="ttrg.keyboard=this.value">

<option value="0" selected="">🔄 = ⬆️ , ⬅️ = ⬅️ , ➡️ = ➡️ , ⬇️ = ⬇️ , ⏬ = space</option>

<option value="1">🔄 = w , ⬅️ = a , ➡️ = d , ⬇️ = s , ⏬ = x</option>

<option value="2">NUM : 🔄 = 8 , ⬅️ = 4 , ➡️ = 6 , ⬇️ = 5 , ⏬ = 2</option>

</select>

</div>

​

</div>

</div>

</div>

​

저작자표시