Marek: Zellenfarbe verändern beim Darüberscrollen

Hallo!
Ich hab da eine Frage:
Meine frühere Webseite hatte eine Navigation die aus einer Tabelle bestand, wobei jede Zelle ein Link enthalten hat.
Mit Javascript hab ich es dann geschafft das ein rollover-Effekt zustande kam, der bewirkte das die gesamte Zelle eine andere Farbe bekam.
Nun hab ich hier schon des öfteren gelesen, dass Javascript sehr verpöhnt ist, also wollte ich mal fragen ob man den gleichen Effekt auch mit CSS zustande bringen kann ...

Bisher hab ich nur den Ausdruck background-color: #farbe; gefunden und dieser bewirkt nur, dass die Schrift (der Link) mit einem Kasten in der definierten Farbe umrahmt wird bzw. hinterlegt wird wenn man darüber scrollt - allerdings will ich ja das die gesamte Zelle der Tabelle eine andere Hintergrundfarbe bekommt.

Wär klasse wenn ihr mir weiterhelfen könntet
(hoffe die Frage ist nicht allzu blöd gestellt, bin noch blutiger Anfänger)

  1. Schau dir die Pseudoklasse hover an und klatsch das Ding mit background-color auf Deine Zelle. ;-)

    Gruss vom netten Tommi

  2. Hallo Marek!

    Da der IE hover nur für <a> kennt ist es ein wenig schwerer dies vernünftig umzusetzen. Eine Lösung wäre, dass Du aus einem <a> ein Block Element machst und dieses dann mittels Hover einfärbst. Dann sparst Du Dir auch die Tabellenzelle.

    Vielleicht fällt anderen Usern ja noch etwas eleganteres ein.

    Schönen Gruß

    Afra

  3. Hi,

    also wollte ich mal fragen ob man den gleichen Effekt auch mit CSS zustande bringen kann ...

    kann man: http://de.selfhtml.org/css/layouts/navigationsleisten.htm#vertikal

    (hoffe die Frage ist nicht allzu blöd gestellt, bin noch blutiger Anfänger)

    Ach quatsch. Gerade als Anfänger ist es schwierig sich in die komplexe Welt von CSS einzuarbeiten.

    MfG Hopsel

    --
    "It's amazing I won. I was running against peace, prosperity, and incumbency."
    George W. Bush speaking to Swedish Prime Minister unaware a live television camera was still rolling, June 14, 2001
    Selfcode: ie:% fl:( br:> va:) ls:& fo:) rl:? n4:& ss:| de:] js:| ch:? sh:( mo:) zu:)
  4. Ahoi Marek,

    Bisher hab ich nur den Ausdruck background-color: #farbe; gefunden und dieser bewirkt nur, dass die Schrift (der Link) mit einem Kasten in der definierten Farbe umrahmt wird bzw. hinterlegt wird wenn man darüber scrollt - allerdings will ich ja das die gesamte Zelle der Tabelle eine andere Hintergrundfarbe bekommt.

    also hast du schon die pseudoklasse :hover entdeckt, geh ich da recht in
    der annahme? wenn du bei deinen <a> tags width, und height auf 100%
    stellst und display: block machst müsste es so funktionieren wie du
    willst.

    MfG

    1. Hallo Daniel,

      also hast du schon die pseudoklasse :hover entdeckt, geh ich da recht in
      der annahme? wenn du bei deinen <a> tags width, und height auf 100%
      stellst und display: block machst müsste es so funktionieren wie du
      willst.

      Ja und wenn Marek seine Besucher nicht mit dem ändchen irritieren will, das bei solchen Links aufblinkt deklariert er auch noch cursor:default In so eine Tabellenzelle darf er dann allerdings auch nur noch Inline-Elemente setzen und keine weiteren Links mehr. Es ist halt die Frage, ob das Mareks Vorstellungen entspricht.

      Gruß Gernot

      1. Ahoi Gernot Back,

        Ja und wenn Marek seine Besucher nicht mit dem ändchen irritieren will, das bei solchen Links aufblinkt deklariert er auch noch cursor:default In so eine Tabellenzelle darf er dann allerdings auch nur noch Inline-Elemente setzen und keine weiteren Links mehr. Es ist halt die Frage, ob das Mareks Vorstellungen entspricht.

        soweit ichs verstanden hab gehts um ne navi-tabelle, von daher denk ich schon das dies das gewünschte ergebniss liefert.

        MfG

        1. Hallo Daniel,

          soweit ichs verstanden hab gehts um ne navi-tabelle, von daher denk ich schon das dies das gewünschte ergebniss liefert.

          Überwiegend wird hier ja zu Navigationszwecken eher eine Liste empfohlen, auch und gerade, wenn es Unternavigationspunkte gibt.

          Ich habe da auch dazugelernt.

          Gruß Gernot

  5. Nun hab ich hier schon des öfteren gelesen, dass Javascript sehr verpöhnt ist

    Nein, JavaScript ist nicht verpönt.
    JavaScript ist bei essenziellen Teilen der Website gefährlich!

    JavaScript ist abschaltbar in allen Browsern. Wenn eine Website aber JavaScript benötigt, um benutzt werden zu können, dann ist sie bei den Leuten, die JS abgeschaltet haben, eben nicht mehr nutzbar. Und eine Website, die nicht nutzbar ist, taugt nichts.

    Ein JavaScript, das einen Rollover-Effekt erzeugt ist nicht böse. Es erzeugt ein Gimmick, das nicht notwendig ist für die Nutzung der Website, also überhaupt kein Problem darstellt. Natürlich können das dann einige Leute nicht mehr sehen, aber das ist ja irrelevant.

    Allerdings ist es dumm, hierfür JS einzusetzen, wenn es auch mit CSS geht, was man (idR) nicht abschalten kann. Wenn der Browser kein CSS kann, dann tut das der Nutzbarkeit der Site - genau wie mit JS - keinen ab.