JSFiddle - React, Tailwind, and code Playground

by buicu

HTML

<div id="parentBox">
    <div id="childBox">
	    <select>
   	        <option>Opt1</option>
   	        <option>Opt2</option>
            <option>Opt3</option>
        </select>
    </div>
    <div id="mesIn"></div>
    <div id="mesOut"></div>
</div>

CSS

#childBox {
	width:200px;
	height:200px;
	border:solid thin #900;}

JavaScript

var i = 0, y=0; 
$('#parentBox').on({
    mouseenter:function(e){	
		//console.log ('in: ');
      i++; $('#mesIn').text('IN '+i); 
    },
	mouseleave: function(e){	
      //console.log ('out: ');
      y++; $('#mesOut').text('OUT '+y); 
    }
}, '#childBox');