tutorials.de Buch-Aktion 05/2012
ERLEDIGT
NEIN
ANTWORTEN
7
ZUGRIFFE
1576
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
DIESES THEMA IST
GESCHLOSSEN
  1. 03.10.04 14:51 #1
    DavidBaumhauer DavidBaumhauer ist offline Mitglied Bronze
    Registriert seit
    Jan 2004
    Beiträge
    28
    Hi Leutz,
    ich hatte eine Idee für meine Homepage: Wenn jemand über einen Text fährt, dann soll dieser sich anders färben, genau wie bei meinen Links. Das mit den Links weiß ich schon lange, ist ja leicht zu verstehen und zu machen. Aber mit normalem Text funktioniert das irgendwie nicht.

    Ich habe es so probiert:

    PHP-Code:
    p  {
    color: #ffffff;
    }

    p:hover {
    color: #000000;
    } 
    PHP-Code:
    <p style="p">
    Irgendein Text ...
    </    p> 
    Vielleicht kann mir jemand erklären, was genau ich falsch mache. Ich glaube, es hat etwas mit dem Hover-Befehl bei p:hover zu tun, das habe ich auch schon versucht zu ändern, jedoch ohne Erfolg.

    Vielen Dank für Eure Hilfe

    C ya David
     
  2. 03.10.04 14:54 #2
    Avatar von Matthias Reitinger
    Matthias Reitinger Matthias Reitinger ist offline ɐɯıǝɹ
    tutorials.de Premium-User
    Registriert seit
    Dec 2001
    Ort
    Bayern
    Beiträge
    5.805
    Blog-Einträge
    5
    Das Problem ist, dass du einen Browser mit lückenhafter CSS-Implementation benutzt Im Mozilla u. Firefox klappt das ganze recht gut.

    Abhilfe schafft da nur der Einsatz von JavaScript mit den Events onMouseOver und onMouseOut.
     
    „Gib einem Menschen einen Fisch, und er wird für einen Tag satt. Lehre ihn Fischen, und er wird ein Leben lang satt.“
    “For every complex problem, there is an answer that is short, simple and wrong.”
    “Pessimism is safe, but optimism is a lot faster!”

    Aktuelles Coding Quiz: #17 - Wörter kreuz und quer
  3. 03.10.04 15:00 #3
    DavidBaumhauer DavidBaumhauer ist offline Mitglied Bronze
    Registriert seit
    Jan 2004
    Beiträge
    28
    Habe auch in einem anderen Forum gelesen, dass mein gewünschter Effekt nur mit Java funktioniert. Könnte mir eventuell jemand erläutern, wie ich das dann machen soll?
     
  4. 03.10.04 15:09 #4
    Avatar von Matthias Reitinger
    Matthias Reitinger Matthias Reitinger ist offline ɐɯıǝɹ
    tutorials.de Premium-User
    Registriert seit
    Dec 2001
    Ort
    Bayern
    Beiträge
    5.805
    Blog-Einträge
    5
    Java != JavaScript

    Code :
    1
2
3

    <p onmouseover="this.style.color='#000000';" onmouseout="this.style.color='#ffffff';">
Foobar!
</p>
     
  5. 03.10.04 15:12 #5
    DavidBaumhauer DavidBaumhauer ist offline Mitglied Bronze
    Registriert seit
    Jan 2004
    Beiträge
    28
    Du bist ein Gott Vielen Dank, ich habe auch gerade damit rumgespielt un onMouseOver="val.color probiert, hat aber immer gesagt, dass der Bereich undefiniert ist
    Geändert von DavidBaumhauer (03.10.04 um 15:14 Uhr)
     
  6. 03.10.04 15:55 #6
    Avatar von Gumbo
    Gumbo Gumbo ist offline
    Registriert seit
    Dec 2002
    Ort
    Trier
    Beiträge
    17.502
    Blog-Einträge
    10
    In deinem Fall würde ich jedoch eine Automatisierung vorschlagen:
    Code :
    1
2
3
4
5
6
7
8
9
10
11

    <script type="text/javascript">
    function init() {
        var paragraphs = document.getElementsByTagName('p');
        for(i=0; i<paragraphs.length; i++) {
            var default_color = paragraphs[i].style.color;
            paragraphs[i].onmouseover = new Function('this.style.color = "#f80"');
            paragraphs[i].onmouseout = new Function('this.style.color = "' + default_color + '"');
        }
    }
    onload = init;
</script>
     
    Markus Wulftange
  7. 04.10.04 21:30 #7
    DavidBaumhauer DavidBaumhauer ist offline Mitglied Bronze
    Registriert seit
    Jan 2004
    Beiträge
    28
    Hm... entweder bin ich einfach zu doof, oder es funktioniert bei mir nicht. Ich habe es in eine .js-Datei eingebaut, ging aber nicht. Und wenn ich es in den Header schreibe, geht es leider nicht.
    Macht aber jetzt auch nichts, das was ich wollte funktioniert prima

    Außerdem will ich nur fast den Ganzen Text so machen, nicht alles
     
  8. 10.10.04 23:13 #8
    Avatar von hela
    hela hela ist offline Mitglied Smaragd
    tutorials.de Premium-User
    Registriert seit
    Oct 2004
    Beiträge
    1.123
    Hallo,
    es geht auch ohne JavaScript. Allerdings kommt man dann um einen Link nicht herum, da der IE6 das Pseudoformat 'hover' wirklich nur beim a-Tag unterstützt.
    Man kann den Link aber als Anker gestalten und mit CSS verstecken:
    HTML-Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>hover-Text</title>
<style type="text/css">
<!--
body {color: black;}
a.blau, a.grn, a.rot {color:black; text-decoration:none; cursor:text;}
a.blau:hover {color: blue;}
a.grn:hover {color: green;}
a.rot:hover {color: red;}
-->
</style>
</head>
<body>
<p>
Das ist normaler Text,
das ist <a name="blau" href="#blau" class="blau">blauer hover-Text</a>,
das ist <a name="gruen" href="#gruen" class="grn">gr&uuml;ner hover-Text</a>,
das ist <a name="rot" href="#rot" class="rot">roter hover-Text</a><br />
und das ist ein ganz normaler Link: <a href="http://www.tutorials.de/forum42">http://www.tutorials.de/forum42</a>.<br />
Getestet mit IE6, Netscape 7.1 und Opera 7.54.
</p>
</body>
</html>
     
« DIV-Box ausrichten | Verdana zeigt kein "&diams;" an »

Ähnliche Themen

  1. Linkfarbe beim drüberfahren ändern
    Von MagicMasterII im Forum Javascript & Ajax
    Antworten: 5
    Letzter Beitrag: 15.08.07, 13:51
  2. onmouseover, wo es kein Link gibt, kann auch keiner sein.
    Von ademola im Forum HTML & XHTML
    Antworten: 1
    Letzter Beitrag: 03.05.07, 23:03
  3. IE6: Links erscheinen erst beim Drüberfahren
    Von olimination im Forum HTML & XHTML
    Antworten: 20
    Letzter Beitrag: 27.02.07, 10:07
  4. Link im Text, Fehler beim Link
    Von Domsi im Forum PHP
    Antworten: 2
    Letzter Beitrag: 08.03.06, 19:56
  5. Bilder aufhellen beim drüberfahren
    Von deluxe-striker im Forum HTML & XHTML
    Antworten: 7
    Letzter Beitrag: 20.01.04, 00:08