Passez la souris sur un champ de vues rognées pour le texte intégral?


8

J'ai un champ de texte dans une table de vues que j'utilise les résultats de la réécriture -> Couper ce champ à une longueur maximale avec l'option points de suspension activée. Est-il possible et comment, de sorte que lorsque je survole ce texte coupé, j'obtienne la version complète sous forme de popup ou que la vue soit mise à jour pour afficher le texte complet?

Réponses:


10

Je déteste répondre à ma propre question sur les primes, mais cela fonctionne exactement comme je le veux.

J'ai trouvé un excellent moyen de le faire avec le module beautytips. Mon champ est une adresse (field_address). Ajoutez field_address aux vues et réécrivez-> découper avec des points de suspension MAIS exclure de l'affichage. Ajoutez à nouveau le même champ cette fois en réécrivant la sortie du champ avec:

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

(J'ai "Ajouter des astuces beauté js à chaque page" activé dans les paramètres des astuces beauté)

+1 à la réponse de zhilevan qui est également une très bonne solution mais manque malheureusement l'option roll-back / rollup / close qui signifierait de très longues tables avec quelques mœurs de lecture ouvertes!


7

Je suggère de Rewrite resultsmettre votre résultat dans un élément html comme <div>ou <span>, de le spécifier avec un idou class. et après cela, utilisez Jquery Readmore Plugin .

Ces exemples peuvent être utiles pour l'utilisation du plugin jquery readmore


Je pense que ce serait formidable, mais comme le premier commentaire le dit sur le premier lien, il a vraiment besoin d'être annulé aussi, surtout que c'est dans un tableau.
7wonders

wow, + 25 points de réputation. vous êtes de grandes merveilles. Merci.
Yuseferi

1

Je dirais de le faire avec JS. C'est beaucoup plus facile et fera toujours le travail.

Pas:

  1. Afficher le champ complet dans la vue
  2. Coupez-le au chargement de la page; cloner la description complète d'origine dans un conteneur séparé et lui donner une classe ou un ID spécial
  3. Ajouter des points de suspension à la fin et attacher une fonction au survol / clic
  4. Une fois que l'utilisateur a cliqué / survolé, affichez la description clonée dans une fenêtre contextuelle (si c'est plus de texte et casserait la mise en page)

En fonction de vos besoins, au lieu de cela, vous pouvez encapsuler les caractères en excès dans une plage et les masquer. Une fois que vous cliquez sur des points de suspension, vous pouvez simplement appliquer une autre classe à la plage et l'afficher.


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));

Ce code peut vous aider à atteindre votre objectif.

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.