JSFiddle - React, Tailwind, and code Playground

by fahadnabbasi

HTML

<div id="my_image1" style="height: 243px; float: left;" class="ui-droppable ui-draggable"><div style="width: 437px; height: 243px; overflow-x: hidden; overflow-y: hidden; display: block; left: 0px; "><img pid="227" style="cursor: pointer; width: 437px; height: 437px; -webkit-transform: matrix(1, 0, 0, -1, 0, 0); " src="http://img3.etsystatic.com/il_fullxfull.283239923.jpg"></div></div>

JavaScript

function show_tooltip()
{
    var inner = $('<div />', {href: '#', 'class': 'montage-tool', css:{'border-radius':'3px', background:'#fef4e4', 'box-shadow':'0 3px 2px -2px #BBBBBB','padding':'8px 10px', 'border':'1px solid #bbbbbb', 'font-family': 'Arial', 'font-weight':'bold','font-size': '13px', margin:'0 auto', color:'#343434', float:'left', left:'10px', top:'-50px', position:'relative', width:'200px', height:'200px'}});

    $('#my_image1').append(inner)
    inner.fadeOut("slow");
}
show_tooltip()