Linuchs: laufender Text im td

problematische Seite

Moin,

aus Platzgründen möchte ich den Text in der Tabelle „Vorschau“ bei hover laufen lassen. Zusätzlich zum Ort sollen noch die Veranstaltungstypen in den td.

Dieses ehemalige html marquee ist z.B. üblich bei Radios, wenn Titel und Interpret angezeigt werden. Also nichts Exotisches.

Doch ich werde aus den Angaben zu animation nicht schlau, bei mozilla gefunden, doch der Text bewegt sich nicht (zunächst ohne hover):

animation: 3s linear 1s infinite alternate slidein;

Wenn ich das mozilla-Feld untrsuche, finde ich

<div id="example-element" style="animation: 3s linear 1s infinite alternate none running slidein;"></div>

und dazu einen Roman an Eigenschaften, kann nicht erkennen, wo sich der Kern verbirgt.

Wie muss das minimale CSS aussehen?

fragt Linuchs

  1. problematische Seite

    Hallo,

    Also nichts Exotisches.

    Exotisch nicht, aber idiotisch. Es ist so nervig, zu warten bis endlich die zu lesende Information auftaucht.

    Was spricht gegen ein popup, das man in seiner individiellen Geschwindigkeit lesen kann?

    Gruß
    Kalk

    1. problematische Seite

      Was spricht gegen ein popup, das man in seiner individiellen Geschwindigkeit lesen kann?

      Daran habe ich noch gar nicht gedacht. Danke für die Idee.

      1. problematische Seite

        Popup habe ich gemacht, gefällt mir nicht

        Man muss das Info-Icon genau treffen und klicken. Maus über den Text halten ist einfacher. Außerdem kommt da ja kein Roman, sondern max. drei Veranstaltungstypen.

        Also bitte doch die Frage mit dem marquee aufgreifen

        Nur lesen geht viel schneller als zielen, klicken und lesen

        1. problematische Seite

          Popup habe ich gemacht, gefällt mir nicht

          Bei dem Beispiellink würde ich ein klassisch einen Button "mehr..." einbauen. Versteckes DIV aufklappen und fertig.

        2. problematische Seite

          Hallo Linuchs,

          Man muss das Info-Icon genau treffen und klicken.

          dann mach die sensitive Fläche doch größer, ich glaube, padding hilft da. Oder mach den ganzen Text zusätzlich sensitiv.

          Gruß
          Jürgen

        3. problematische Seite

          Hallo Linuchs,

          und aus dem Radiowecker ertönt allmorgendlich "I got you Babe" von Sonny und Cher.

          Was du gemacht hast, ist nicht bedienbar. Ein img Element ist nicht interaktiv. Das muss ein Button sein, damit man die Info nicht nur per Maus bekommt. Das gilt für die Kartenansicht und den Info-Button.

          Für die Kartenansichten würde ich eher ein a Element empfehlen, damit Du bei inaktivem JavaScript auf eine Kartenseite verlinken kannst. Wenn JS aktiv ist, kann das Kartenpopup als progressive enhancement kommen.

          Zur Info: Warum versteckst Du die überhaupt? Mach doch eine zweite Zeile, wo die Infos drinstehen. Dann brauchst Du auch nicht die kryptischen Kürzel "Lau" oder "His". In manchen Fällen können es dann auch 3 Zeilen werden (das Hafenfest Warendorf ist etwas umfangreicher) - aber egal. Vertikaler Platz kostet nichts, und etwas Luft in der Liste steigert die Lesbarkeit signifikant.

          Zum Font: Gut, dass es eine Bildschirmlupe gibt. Denk dran, dass deine Zielgruppe vermutlich aus Senioren besteht. Von denen haben viele schlechte Augen. 12,8px, oder sogar 10,7px für die Uhrzeit, ist eine ergonomische Zumutung. Und dabei habe ich noch einen Bildschirm mit einem dpi-Wert unter 100. Die Browser haben aus gutem Grund 16px als Default.

          Rolf

          --
          sumpsi - posui - obstruxi
          1. problematische Seite

            Hallo Rolf,

            Das muss ein Button sein

            Problem: Auf einer anderen Seite hatte ich zwei Buttons, jeweils in <a> einschlossen. Da ich mit rechter Maustaste Link im neuen Tab öffne, funktionierte das wie gewünscht.

            Dann rief jemand an, der Link funktioniert nicht, ist passiv.

            Was war passiert? Jeder der beiden buttons taten so, als hätten sie ein submit, obwohl sie nicht in <form> waren. Riefen ihre eigene Seite wieder auf.

            Also mehrere buttons auf einer Webseite - Problem.

            Kartenansichten würde ich eher ein a Element empfehlen, damit Du bei inaktivem JavaScript auf eine Kartenseite verlinken kannst

            Ohne Javascript funktioniert leaflet nicht, da sollte ich auch nicht verlinken. Siehe dir die Seite mal ohne JS an.

            1. problematische Seite

              Hallo Linuchs,

              Jeder der beiden buttons taten so, als hätten sie ein submit,

              <button type="button">No Submit</button>
              

              Der Default für type ist "submit".

              Rolf

              --
              sumpsi - posui - obstruxi
            2. problematische Seite

              Hi,

              Problem: Auf einer anderen Seite hatte ich zwei Buttons, jeweils in <a> einschlossen.

              Das ist dann aber ein selbstgemachtes Problem.

              Was soll dann beim Klick auf den Button passieren? Soll die Button-Aktion ausgelöst werden? Oder der Link? Oder Beides?

              m.E. ist es unsinnig, buttons in links zu packen.

              Jeder der beiden buttons taten so, als hätten sie ein submit

              weil Du den Buttons nicht mitgeteilt hast, daß es keine Submit-Buttons sind?

              cu,
              Andreas a/k/a MudGuard

              1. problematische Seite

                Hallo MudGuard,

                Oha. Gerade erst genau gelesen.

                Auf einer anderen Seite hatte ich zwei Buttons, jeweils in <a> einschlossen.

                m.E. ist es unsinnig, buttons in links zu packen.

                Das ist nicht dein Erachten. Das ist die Spec. Interaktive Elemente zu schachteln ist verboten.

                Rolf

                --
                sumpsi - posui - obstruxi
                1. problematische Seite

                  Hi,

                  m.E. ist es unsinnig, buttons in links zu packen.

                  Das ist nicht dein Erachten. Das ist die Spec.

                  Doch, das ist mein Erachten. Zufälligerweise 😉 ist's auch der Spec's Erachten 😉

                  cu,
                  Andreas a/k/a MudGuard

            3. problematische Seite

              @@Linuchs

              Problem: Auf einer anderen Seite hatte ich zwei Buttons, jeweils in <a> einschlossen.

              Du bist das lebende Beispiel dafür, dass sich jemand jahrelang mit Webentwicklung befassen kann und immer noch keine Ahnung von den Grundlagen hat.

              button in a ist ebensowenig erlaubt wie a in button, a in a oder button in button. Das hätte dir der Validator auch gesagt. Aber HTML-Kenntnisse sind wohl überbewertet.

              🖖 Живіть довго і процвітайте

              --
              When the power of love overcomes the love of power the world will know peace.
              — Jimi Hendrix
        4. problematische Seite

          @@Linuchs

          Popup habe ich gemacht, gefällt mir nicht

          Der Wurm muss dem Fisch schmecken, nicht dem Angler.

          Man muss das Info-Icon genau treffen und klicken.

          Dann löse dieses Problem anstatt zwei andere zu schaffen.

          🖖 Живіть довго і процвітайте

          --
          When the power of love overcomes the love of power the world will know peace.
          — Jimi Hendrix