Text bei Mausberührung verändern mit Javascript

In diesem Artikel lesen Sie, wie Sie die Formatierung eines Textbereiches bei Berührung mit der Maus verändern können.

Normalerweise sind Textbereiche, die betont werden sollen, von Anfang an fett oder kursiv formatiert. Möchten Sie den Text erst bei Berührung mit der Maus z.B. fett oder kursiv formatieren, können Sie dies mit dem folgenden Javascript leicht bewerkstelligen.

Die Funktion TextVeraendern(…) wird beim MouseOver ausgeführt und lässt den markierten Bereich fett und kursiv erscheinen. Wird die Maus wieder aus dem Bereich wegbewegt, nimmt die Funktion StandardText(…) die Formatierungen wieder zurück.

<html>
<head>
<script language="JavaScript">
<!--
function TextVeraendern()
{
    document.getElementById("Text").style.fontWeight = "bold";
    document.getElementById("Text").style.fontStyle = "italic";
}

function StandardText()
{
    document.getElementById("Text").style.fontWeight = "normal";
    document.getElementById("Text").style.fontStyle = "normal";
}
//-->
</script>
<title>Text bei Mausberührung verändern</title>
</head>
<body>

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. <span id="Text" onMouseOver="TextVeraendern();" onMouseOut="StandardText();">Donec ultricies</span>. Nullam at magna. Curabitur vitae enim nec felis congue mollis. Vestibulum lorem leo, nonummy eget, vulputate at, porttitor id, tellus.

</body>
</html>
1958 Tage ago by in Javascript | You can follow any responses to this entry through the RSS feed. You can leave a response, or trackback from your own site.

Leave A Response