Tooltip Texteinblendung bei Mouseover

Moderator: HTML-Laie

Antworten
Benutzeravatar
Hape
Administrator
Beiträge: 336
Registriert: Fr 22. Mai 2020, 00:33

Tooltip Texteinblendung bei Mouseover

Beitrag von Hape »

Hier der CSS-Teil:

Code: Alles auswählen

<style type="text/css">
<!--
 body {background-color: #cccccc}

  a.tooltip
{
  position: relative;
  text-decoration: none;
}
a.tooltip span
{
  display: none;
}
a.tooltip:hover span
{
  position: absolute;
  display: block;
  top: 1.5em;
  left: 2em;
  border: 1px solid black;
  background-color:white;
  padding: 0.2em;
  width:200px;
}
-->
</style>
Der Link:

Code: Alles auswählen

<a href="#" class="tooltip">Überqueren Sie mich mit der Maus!<span>Ich bin ein ToolTip der aus einem Text besteht</span></a>
Hier geht es zur Demoseite: http://hapes-javascript-demo-page.hpage ... ltip5.html

Antworten