Matthias Apsel: Tabellenzeile soll bei hover eine infobox anzeigen

Beitrag lesen

Om nah hoo pez nyeetz, theatermacher!

Ich werde also notgedrungen den Code in jede Zelle einbauen. Dabei natürlich Eure Ratschläge betreffend sauberes CSS berücksichtigen.

Nur so ne Idee.

html:

<table>
  <tr class="auslöser"><td..........
  <tr colspan="Spaltenzahl"><td>Inhalt der Box</td></tr>
  <tr class="auslöser"><td..........
  <tr colspan="Spaltenzahl"><td>Inhalt der Box</td></tr>
</table>

css:

[colspan] {position: absolute; top: irgendwo; left: irgendwo;
           display: none;}

.auslöser:hover+[colspan] {display: block;}

  • ungetestet
  • Ich weiß nicht, ob sich eine Tabelle so zerreißen lässt
  • IE6 kann das nicht
  • tbody, table muss position:static behalten

Matthias

--
1/z ist kein Blatt Papier.

0 49

Tabellenzeile soll bei hover eine infobox anzeigen

theatermacher
  • css
  1. 0
    Matthias Apsel
    1. 0
      theatermacher
      1. 0
        Gunther
      2. 0
        Gunnar Bittersmann
        1. 0
          theatermacher
          1. 0
            Gunther
            1. 0
              theatermacher
              1. 1
                Matthias Apsel
                1. 0
                  theatermacher
                  1. 0
                    Der Martin
                    1. 0
                      theatermacher
                      1. 0
                        Gunther
                        1. 0
                          theatermacher
                          1. 0
                            Matthias Apsel
                            1. 0

                              Semantik

                              Gunther
                              • html
                              1. 2
                                Matthias Apsel
                                1. 0
                                  Gunther
                                  1. 0
                                    Matthias Apsel
                                    1. 0
                                      Gunther
                                      1. 1
                                        Der Martin
                                        1. 0
                                          Gunther
                                          1. 0
                                            Matthias Apsel
                                            1. 0
                                              Gunther
                                              1. 0

                                                Link über ganze Tabellenzeile

                                                Matthias Apsel
                                                1. 0

                                                  Link über ganze Tabellenzeile auch für alte Browser

                                                  Matthias Apsel
                                                  1. 0

                                                    Responsive Design

                                                    Gunther
                                                    • design/layout
                                                    1. 0
                                                      Matthias Apsel
                                                      1. 0
                                                        Gunther
                                                        1. 0
                                                          Matthias Apsel
                                                          1. 0
                                                            Gunther
                                                            1. 0

                                                              Das letzte Wort

                                                              Matthias Apsel
                                                              • menschelei
                                      2. 0
                                        Matthias Apsel
                                        1. 0
                                          Matthias Apsel
                                          1. 0
                                            Matthias Apsel
                                  2. 0
                                    Kai345
                                    1. 0
                                      Gunther
                                      1. 0

                                        Zugänglichkeit

                                        Matthias Apsel
                                2. 0
                                  Gunnar Bittersmann
                    2. 0
                      Matthias Apsel
                    3. 0
                      Gunnar Bittersmann
                      1. 0
                        Matthias Apsel
                      2. 0
                        Der Martin
                  2. 0
                    Matthias Apsel
                    1. 0
                      Matthias Apsel
        2. 1
          Kai345
          1. 0
            Gunnar Bittersmann
            1. 0
              Matthias Apsel
            2. 1
              Kai345