mobile events

by gravof

HTML

<div id="handle">
    <div id="target"></div>
</div>

CSS

html {
    height: 100%;

}
body {
    background: green;
    -webkit-tap-highlight-color: #ccc
}
#handle {
    position: relative;
    width: 200px;
    height: 100px;
    background: gray;
}

#target {
    position: absolute;
    top: 50px;
    width: 200px;
    height: 200px;
    background: aqua;
    display: none;
}

JavaScript

$('#handle').on('mouseover', function() {
    $('#target').show();
});

$('html').on('click', function() {});

$('#handle').on('mouseout', function() {
    $('#target').hide();
});