Hi iammann,
Check this sample. now take its reference.
HTML
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="https://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/themes/blitzer/jquery-ui.css" />
<script type="text/javascript">
$(function () {
$("#dialog").dialog({
modal: true,
autoOpen: false,
title: "jQuery Dialog",
width: 300,
height: 150
});
$('[id*=txtPopUp]').on('mouseover', function () {
if (document.cookie.indexOf("cookies") < 0) {
document.cookie = "cookies=yes; max-age=" + (5 * 365 * 24 * 60 * 60);
$("#dialog").dialog("open");
}
});
});
</script>
</head>
<body>
<div>
<input type="text" id="txtPopUp" />
<div id="dialog" style="display: none">
This is a jQuery Dialog.
</div>
</div>
</body>
</html>
Demo
