JS popup
Zobrazí popup pomocí JS
html-css
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Vyskakovací okno</title>
<style>
.popup {
display:block;
padding:5px;
border:1px solid black;
position:relative;
top:10px;
left:50px;
display:none;
background-color:lightgray;
width:400px;
}
</style>
</head>
<body>
<p>Moje věta která obsahuje odbornou zkratku <a href="#" onmouseover="showPopup('HTML')" onmouseout="hideOpenedPopup()">HTML</a><span id="HTML" class="popup">Hyper Text Markup Language</span></p>
<p>Moje druhá věta která obsahuje slovo <a href="#" onmouseover="showPopup('JS')" onmouseout="hideOpenedPopup()">JavaScript</a><span id="JS" class="popup">JavaScript = ECMAScript</span></p>
<p>Moje třetí věta která obsahuje odbornou zkratku <a href="#" onmouseover="showPopup('CSS')" onmouseout="hideOpenedPopup()">CSS</a><span id="CSS" class="popup">Kaskádové styly</span></p>
<script>
var openedPopup = "";
function showPopup(popupName) {
openedPopup = popupName;
document.getElementById(popupName).style.display = "block";
}
function hideOpenedPopup() {
document.getElementById(openedPopup).style.display = "none";
}
</script>
</body>
</html>
Neformátovaný
Přidáno: 16.3.2013
Expirace: Neuvedeno