Rolf B: Tabelle einklappbar

Beitrag lesen

Hallo Feffo, oder Steffi,

Welcher Befehl ist dafür vorgesehen?

Keiner. HTML hat Elemente 😉

Eigentlich sind dafür <details> und <summary> da. Die werden von Firefox, Chrome und Safari unterstützt, von den Microsoft-Browsern nicht. Dort siehst Du dann ständig die aufgeklappte Tabelle.

Dumm ist nur, dass Du dann keine automatische Breitenaufteilung mehr verwenden kannst, weil Du die Tabelle zweiteilen musst. Die Überschriften kommen in <summary> hinein, die Datenzeilen darunter. D.h. du müsstest die Spaltenbreiten fest vorgeben und ggf. mit CSS dafür sorgen, dass keine Abstände und kein Versatz zwischen Überschrift und Inhalt entstehen.

Ohne <details>/<summary> wirst Du einen Button brauchen, der mit einer Prise JavaScript dafür sorgt, das die Sichtbarkeit des <tbody> umgeschaltet wird. Einen Mausklick auf den th-Elementen abzufangen ist technisch zwar möglich, praktisch aber falsch weil es die Benutzbarkeit unzulässig einschränkt. Du kannst diesen Button auch in eins der th Elemente hineinsetzen.

Welchen Weg willst Du gehen?

Rolf

--
sumpsi - posui - clusi
0 84

Tabelle einklappbar

Feffo
  • css
  • html
  • tabelle
  1. 0
    Rolf B
    1. 1
      Gunnar Bittersmann
      1. 1
        Rolf B
    2. 0
      Pit
      1. 0
        Auge
        1. 0
          Pit
          1. 3
            Auge
            1. 2
              Pit
              1. 1
                Christian Kruse
                1. 1
                  Gunnar Bittersmann
                  • barrierefreiheit
                  • inclusive design
                  1. 0
                    Christian Kruse
                    1. 0
                      marctrix
                      1. 1
                        ursus contionabundo
                        1. 0
                          Gunnar Bittersmann
                          • menschelei
                          1. 0
                            ursus contionabundo
              2. 1
                marctrix
                1. 0
                  marctrix
                  1. 0
                    Tabellenkalk
                    1. 1
                      Matthias Apsel
                      1. 0
                        Tabellenkalk
          2. -2
            Bernd
            1. 0
              Christian Kruse
          3. 1
            Gunnar Bittersmann
            • barrierefreiheit
            • inclusive design
            1. 1

              messages from real live

              ursus contionabundo
      2. 1
        Matthias Apsel
        • barrierefreiheit
      3. 0
        JürgenB
        1. 1
          Gunnar Bittersmann
          1. 1
            JürgenB
            1. 1
              Auge
            2. 1
              Tabellenkalk
              1. 0
                Gunnar Bittersmann
                1. 0
                  JürgenB
                  1. 1
                    Tabellenkalk
                  2. 0
                    Auge
                2. 0
                  Gunnar Bittersmann
                  1. 0
                    Matthias Apsel
                    1. 0
                      Gunnar Bittersmann
                      1. 0
                        JürgenB
                        1. 0
                          Gunnar Bittersmann
                          • design
                          • tabelle
                          1. 0
                            JürgenB
                            1. 0
                              Gunnar Bittersmann
                              1. 0
                                Matthias Apsel
                                1. -2
                                  Gunnar Bittersmann
                              2. 0
                                JürgenB
                              3. 2
                                Christian Kruse
                                1. 0
                                  Gunnar Bittersmann
                                  1. 2
                                    Christian Kruse
                                    1. 0
                                      Gunnar Bittersmann
                                      1. 2
                                        Christian Kruse
                                        1. 2
                                          JürgenB
                                          1. 0
                                            Matthias Apsel
                                            1. 0
                                              Gunnar Bittersmann
                                              1. 0
                                                Matthias Apsel
                                              2. 0
                                                JürgenB
                                          2. 0
                                            Christian Kruse
                                            1. -1
                                              Gunnar Bittersmann
                                              1. 2
                                                Christian Kruse
                                        2. 0
                                          Gunnar Bittersmann
                                          1. 0
                                            Matthias Apsel
                                            1. 0
                                              Gunnar Bittersmann
                                      2. 2
                                        ursus contionabundo
                                        1. 0
                                          Auge
                                          1. 0
                                            Gunnar Bittersmann
                                            1. 0
                                              Matthias Apsel
                                              1. 0
                                                Gunnar Bittersmann
                                            2. 0
                                              Auge
                                              • design
                                              • meinung
                                              • tabelle
                                    2. 0
                                      marctrix
                                  2. 0
                                    sm
                                    1. 0
                                      marctrix
                                    2. 1
                                      Gunnar Bittersmann
                                      1. 0
                                        Matthias Apsel
                                        1. 0
                                          Gunnar Bittersmann
                                          1. 0
                                            Matthias Apsel
                                2. 0
                                  Gunnar Bittersmann
                              4. 0
                                Just try it!
                                1. 0
                                  Tabellenkalk
                  2. 0
                    JürgenB
                    1. 0
                      JürgenB
                    2. 0
                      Gunnar Bittersmann
                      • javascript
                      • tabelle
                    3. 0
                      Gunnar Bittersmann
                      1. 1
                        JürgenB
                        1. 0
                          Matthias Apsel
                          1. 0
                            JürgenB