JSFiddle - React, Tailwind, and code Playground

by Nickolay Ilchenko

HTML

<div id="field">
    <img src="http://ru.lookatcode.com/show/7819291751366109/ball.gif" id="ball" />. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .</div>

CSS

#field {
      width: 200px;
      height: 150px;
      border: 10px groove black;
      background-color: #00FF00;
      position: relative;
      overflow: hidden;
  }
  #ball {
      position: absolute;
      top: 50%;
      left: 50%;
      margin-left: -20px;
      margin-top: -20px;
  }

JavaScript

var field = document.getElementById('field'),
    ball = document.getElementById('ball');

field.onlick = function (event) {
    alert('1234');
}