suchen

Heim >Web-Frontend >js-Tutorial >js-Methode zum Implementieren einer Eingabeaufforderungsebene, wenn sich die Maus über den Link text_javascript skills bewegt

js-Methode zum Implementieren einer Eingabeaufforderungsebene, wenn sich die Maus über den Link text_javascript skills bewegt

WBOY
WBOYOriginal
2016-05-16 15:59:501227Durchsuche

Das Beispiel in diesem Artikel beschreibt, wie Sie mit js eine Eingabeaufforderungsebene implementieren, wenn die Maus über den Linktext bewegt wird. Teilen Sie es als Referenz mit allen. Die spezifische Analyse lautet wie folgt:

Hier ist der Effekt, wenn man die Maus über den Linktext bewegt und eine definierte DIV-Ebene öffnet. In dieser Ebene können Sie diesem Link entsprechende Informationen hinzufügen, die zu einem Informationsaufforderungsfenster werden. Dieser Effekt ist bei Taobao und Sina zu sehen, was sehr praktisch ist. 

<!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>鼠标移到文字上弹出提示层</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()">
鼠标放到这儿！
</a>
<div id="box" onmouseover="display()" onmouseout="disappear()">
效果不错吧？这里面你可以设置一张图片，也可以是一段文字，
而且源代码很简单哦！
</div>
</body>
</html>

Ich hoffe, dass dieser Artikel für das JavaScript-Programmierdesign aller hilfreich sein wird.

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：Detaillierte Erläuterung der Verwendung von Location in JS_Javascript-KenntnissenNächster Artikel：Detaillierte Erläuterung der Verwendung von Location in JS_Javascript-Kenntnissen

In Verbindung stehende Artikel

Mehr sehen