I really have no idea about Kobo, here is the code for both ways to show pop-ups:
Code:
<?xml version='1.0' encoding='utf-8'?>
<html xmlns:epub="http://www.idpf.org/2007/ops" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Demo ePub3 Popups</title>
<script>
function tooltip_open(x) {
document.getElementById(x).style.display="block";
}
function tooltip_close(y) {
document.getElementById(y).style.display="none";
}
</script>
<style>
.tooltip {
background: rgb(242, 242, 242);
border: 2px solid #a1a1a1;
border-radius: 25px;
display: block;
z-index: 9999;
position: relative;
padding: 0 10px 0 10px;
display: none;
}
</style>
</head>
<body>
<h1>Javascript example</h1>
<p><a href="#tooltip1" onclick="tooltip_open('tooltip1')">CLICK ME</a></p>
<div class="tooltip" id="tooltip1">
<p>LoL this is a popup LoL</p>
<p><a href="#close" onclick="tooltip_close('tooltip1')">[X]</a></p>
</div>
<a id="close"></a>
<h1>Aside example</h1>
<p><a epub:type="noteref" href="#n1">CLICK ME</a></p>
<aside epub:type="footnote" id="n1">
<p>LoL this is a popup LoL</p>
</aside>
</body>
</html>