js implements the method of mouse over the link text to pop up a prompt layer

2020-06-12 08:28:57
OfStack

This article describes the js implementation of mouse over the link text pop-up 1 prompt layer method. Share to everybody for everybody reference. The specific analysis is as follows:

Move the mouse over the link text and a defined DIV layer will pop up. In this layer you can add the information corresponding to this link, so as to become an information prompt window, taobao, Sina can see this effect, very practical.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> Mouse over the text to pop up the prompt layer </title>
<style type="text/css">
<!--
#box{
display:none;
width: 315px;
height: 180px; 
background:#CCC;
border:1px solid #333;
padding:12px;
text-align:center;
}
-->
</style>
<script type="text/javascript" language="javascript" >
<!--
function display(){
document.getElementById("box").style.display="block"; 
}
function disappear(){
document.getElementById("box").style.display="none"; 
}
-->
</script>
</head>
<body>
<a href="#" onmouseover="display()" onmouseout="disappear()">
 Mouse over here! 
</a>
<div id="box" onmouseover="display()" onmouseout="disappear()">
 Isn't that good? Here you can set it 1 A picture, or it could be 1 Paragraph, 
 And the source code is very simple oh! 
</div>
</body>
</html>

I hope this article has been helpful for your javascript programming.