Bewegen Sie den Mauszeiger über ein beschnittenes Ansichtsfeld für Volltext?

8

Ich habe ein Textfeld in einer Ansichtstabelle, in dem ich die Ergebnisse zum Umschreiben verwende -> Dieses Feld mit aktivierter Auslassungsoption auf eine maximale Länge zuschneiden. Ist es möglich und wie, dass ich beim Bewegen des Mauszeigers über diesen zugeschnittenen Text die Vollversion als Popup erhalte oder dass die Ansicht aktualisiert wird, um den Volltext anzuzeigen?

views entities theming 7 Wunder
quelle

Antworten:

10

Ich hasse es, meine eigene Kopfgeldfrage zu beantworten, aber das funktioniert genau so, wie ich es will.

Ich habe eine großartige Möglichkeit gefunden, dies mit dem Beautytips-Modul zu tun. Mein Feld ist eine Adresse (Feldadresse). Fügen Sie den Ansichten die Feldadresse hinzu und schreiben Sie sie neu-> mit Auslassungspunkten, ABER schließen Sie sie von der Anzeige aus. Fügen Sie dieses Mal dasselbe Feld erneut hinzu und schreiben Sie die Ausgabe des Felds neu mit:

<div class="beautytips" title="[field_address_1]">[field_address]</div>

(Ich habe "Schöne Tipps zu jeder Seite hinzufügen" in den Einstellungen für schöne Tipps aktiviert.)

+1 zhilevans Antwort, die ebenfalls eine sehr gute Lösung ist, aber leider die Option Rollback / Rollup / Close fehlt, was sehr lange Tabellen mit ein paar offenen Lesemitten bedeuten würde!

7 Wunder
quelle
7

Ich schlage vor Rewrite results, Ihr Ergebnis in ein HTML-Element wie <div>oder <span>einzufügen und es mit einem idoder anzugeben class. und danach verwenden Sie das Jquery Readmore Plugin .

Diese Beispiele können für die Verwendung des jquery readmore-Plugins nützlich sein

Yusef
quelle
Ich denke, das wäre großartig, aber wie der erste Kommentar zum ersten Link sagt, muss es auch wirklich zurückgesetzt werden, insbesondere, da es in einer Tabelle steht.
7wonders
Wow, + 25 Ruf. Sie sind großartige Wunder. Vielen Dank.
Yusef
1

Ich würde sagen, das mit JS zu tun. Es ist viel einfacher und wird immer noch die Arbeit erledigen.

Schritte:

  1. Geben Sie das vollständige Feld in der Ansicht aus
  2. Schneiden Sie es beim Laden der Seite; Klonen Sie die ursprüngliche vollständige Beschreibung in einen separaten Container und geben Sie ihr eine spezielle Klasse oder ID
  3. Fügen Sie am Ende eine Ellipse hinzu und fügen Sie beim Hover / Click eine Funktion hinzu
  4. Sobald der Benutzer klickt / schwebt, wird die geklonte Beschreibung in einem Popup angezeigt (wenn es sich um mehr Text handelt und das Layout beschädigt wird).

Abhängig von Ihren Anforderungen können Sie stattdessen die überschüssigen Zeichen in einen Bereich einschließen und ausblenden. Sobald Sie auf Auslassungspunkte klicken, können Sie einfach eine andere Klasse auf den Bereich anwenden und anzeigen.

Aram Boyajyan
quelle
1 
(function($) {
    Drupal.behaviors.expalain_popup = {
      attach:function() {
        jQuery('a.open_popup_link').click(function(){
          var node_id = jQuery(this).attr('data-value');
          window.open('/open_popup/node/'+node_id, 'Explain '+node_id,'width=450,height=600,resizable=1,scrollbars=1,toolbar=0,location=0');
        });
    }
  };
}(jQuery));

Dieser Code kann Ihnen helfen, Ihr Ziel zu erreichen.

Rishi
quelle