CTPEKO3A: CSS-ID beim mouseover wechseln?

Hallo,

ich möchte dem Benutzer in meinen Tabellen die ganze Zeile von Zellen markieren, wenn er mit dem Mauszeiger über eine Zeile geht.

Dafür habe ich in einer css-Datei 2 IDs angelegt. In einem ist der Border auf 0 gesetzt in anderem auf 1. Nun hackt es irgendwo...

<tr onmouseover="id='.border1'" onmouseout="id='.border0'">

Oder ist sowas nicht möglich?

Danke!

  1. Hallo CTPEKO3A,

    <tr onmouseover="id='.border1'" onmouseout="id='.border0'">

    wenn es um die ID der Tabellenzeile geht, versuch mal this.id='...'
    Und wenn alle IE<7 erst mal verschwunden sind, kannst du auch hover verwenden.

    Gruß, Jürgen

    1. Hi,

      wenn es um die ID der Tabellenzeile geht, versuch mal this.id='...'
      Und wenn alle IE<7 erst mal verschwunden sind, kannst du auch hover verwenden.

      Deprimier die Leute doch nicht so! >:->

      Gruß, Cybaer

      --
      Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
      1. Hallo Cybaer,

        Und wenn alle IE<7 erst mal verschwunden sind, kannst du auch hover verwenden.

        Deprimier die Leute doch nicht so! >:->

        so deprimierend sieht das garnicht aus. Auf meiner kleinen Seite steht es im Moment etwa 3:1 (IE6:IE7). Der automatische Update scheint zu greifen.

        Gruß, Jürgen

        1. Hi,

          so deprimierend sieht das garnicht aus. Auf meiner kleinen Seite steht es im Moment etwa 3:1 (IE6:IE7). Der automatische Update scheint zu greifen.

          Ich wage nicht zu prophezeien, wann so manche größere Firma/Behörde Abschied nimmt von Windows 2000 (IE 6) oder gar noch Windows NT (IE 5.5) ...

          Gruß, Cybaer

          --
          Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
  2. Hi,

    <tr onmouseover="id='.border1'" onmouseout="id='.border0'">

    id-Werte dürfen nicht mit einem Punkt beginnen.
    Und da Du sicher nicht nur eine Zeile hast, id-Werte aber eindeutig sein müssen, bietet es sich eher an, die Klasse per className zu ändern (aber auch bei Klassen gibt es Probleme, wenn das erste Zeichen ein Punkt ist ...)

    tr:hover bietet sich eigentlich an (dann haben halt die Nutzer des IE < 7 nichts von dem Effekt, das wird sie aber entweder nicht stören, weil sie gar nicht merken, daß es den Effekt gäbe, oder aber anregen, den Browser zu wechseln, wenn sie in einem richtigen Browser sehen, daß es den Effekt gibt ...)

    Nun hackt es irgendwo...

    am Brennholz?

    cu,
    Andreas

    --
    Warum nennt sich Andreas hier MudGuard?
    Schreinerei Waechter
    O o ostern ...
    Fachfragen unaufgefordert per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
    1. Ich habe mal nachgeforscht und es gibt kein Attribut "border" beim TR-Tag... Leider...

      1. hi,

        Ich habe mal nachgeforscht und es gibt kein Attribut "border" beim TR-Tag...

        Natürlich nicht.
        Ein Rahmen gehört zur Darstellung, und Darstellung ist (Aufgabe von) CSS.

        Leider...

        Nein, zum Glück.

        gruß,
        wahsaga

        --
        /voodoo.css:
        #GeorgeWBush { position:absolute; bottom:-6ft; }
        1. Natürlich nicht.
          Ein Rahmen gehört zur Darstellung, und Darstellung ist (Aufgabe von) CSS.

          Ok, dann was mache ich hier falsch?

          css-Datei:

          8<-----------8<

          .redBorder_1 {

          border: #ff0000 solid 1px;

          }

          .redBorder_0 {

          border: #ff0000 solid 0px;

          }

          .blackBackground {

          background-color: #000000;

          }

          8<-----------8<

          html-Datei:

          8<-----------8<

          <tr onmouseover="this.className='redBorder_1';" onmouseout="this.className='redBorder_0';">
           <td class=".blackBackground">changed</td>
           <td class=".blackBackground">changed</td>
          </tr>

          8<-----------8<

          Danke

          1. <td class=".blackBackground">changed</td>
            <td class=".blackBackground">changed</td>

            Also besser so (ohne Punkte):-)

            <td class="blackBackground">changed</td>
            <td class="blackBackground">changed</td>

          2. Ok, dann was mache ich hier falsch?
            <tr onmouseover="this.className='redBorder_1';" onmouseout="this.className='redBorder_0';">
            <td class=".blackBackground">changed</td>
            <td class=".blackBackground">changed</td>
            </tr>

            Nichts machst du falsch, du wechselst die Klasse des TR Elementes

            Struppi.

            --
            Javascript ist toll (Perl auch!)
            1. Nichts machst du falsch, du wechselst die Klasse des TR Elementes

              ...wenn der Mauszeiger über dem TR-Element ist. Aber ich sehe kein Border um die Zellen... :-(

              1. Nichts machst du falsch, du wechselst die Klasse des TR Elementes

                ...wenn der Mauszeiger über dem TR-Element ist. Aber ich sehe kein Border um die Zellen... :-(

                wieso solltest du auch?
                die Zellen sind nicht das TR Element.

                Struppi.

                --
                Javascript ist toll (Perl auch!)
                1. wieso solltest du auch?

                  Weil der TR-Tag die Zellen in einer Zeile gruppiert oder?

                  die Zellen sind nicht das TR Element.

                  Wozu ist dann dashier:

                  <table>
                   <tr>
                    <td>A</td>
                    <td>B</td>
                   </tr>
                  </table>

                  1. wieso solltest du auch?

                    Weil der TR-Tag die Zellen in einer Zeile gruppiert oder?

                    Ja, aber durch den Wechsel der Klasse geht der nicht auf die Zellen über. Ein Tr hat aber auch keinen Border.

                    Struppi.

                    --
                    Javascript ist toll (Perl auch!)
                    1. Ein Tr hat aber auch keinen Border.

                      Ok, hast du recht. Ich dachte, dass man mit CSS dem TR-Tag einen Border zuweisen kann.

                      Nun, wie kann man einen Rahmen um n-Zellen zeigen, wenn man mit dem Mauszeiger rübergeht?

                      Danke für die Tipps!

                    2. Hi,

                      Ja, aber durch den Wechsel der Klasse geht der nicht auf die Zellen über. Ein Tr hat aber auch keinen Border.

                      Das hängt vom border-Modell ab, das man per border-collapse einstellen kann.
                      Läßt man border-collapse auf dem Default-Wert separate, haben tr-Elemente in der Tat keine border.

                      Siehe auch http://www.w3.org/TR/CSS21/tables.html#borders

                      cu,
                      Andreas

                      --
                      Warum nennt sich Andreas hier MudGuard?
                      Schreinerei Waechter
                      O o ostern ...
                      Fachfragen unaufgefordert per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
        2. Nein, zum Glück.

          Und hat's geklappt?