¿Desplaza un campo de vistas recortadas para texto completo?


8

Tengo un campo de texto en una tabla de vistas que utilizo Reescribir resultados -> Recortar este campo a una longitud máxima con la opción de puntos suspensivos activada. ¿Es posible y cómo, de modo que cuando coloco el cursor sobre este texto recortado obtengo la versión completa como una ventana emergente o que la vista se actualice para mostrar el texto completo?

Respuestas:


10

Odio responder a mi propia pregunta de recompensa, pero esto funciona exactamente como lo quiero.

Encontré una excelente manera de hacer esto con el módulo beautytips. Mi campo es una dirección (dirección_campo). Agregue field_address a las vistas y reescriba-> recortar con puntos suspensivos PERO excluya de la pantalla. Agregue el mismo campo nuevamente esta vez reescribiendo la salida del campo con:

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

(Tengo "Agregar beautytips js a cada página" habilitado en la configuración de beautytips)

¡+1 la respuesta de zhilevan, que también es una muy buena solución, pero lamentablemente falta la opción de deshacer / acumular / cerrar que significaría tablas muy largas con algunas lecturas abiertas!


7

Sugiero Rewrite resultsponer su resultado en un elemento html como <div>o <span>, especificarlo con un ido class. y luego use el complemento Jquery Readmore .

Estas muestras pueden ser útiles para usar el complemento jquery readmore


Creo que sería genial, pero como dice el primer comentario en el primer enlace, realmente también necesita revertirse, especialmente porque está en una tabla.
7wonders

wow, + 25 reputación. ustedes son geniales 7wonders. Gracias.
Yusef

1

Yo diría que haga eso con JS. Es mucho más fácil y seguirá haciendo el trabajo.

Pasos:

  1. Salida del campo completo en la vista
  2. Recortarlo en la carga de la página; clonar la descripción completa original en un contenedor separado y darle una clase especial o ID
  3. Agregue puntos suspensivos al final y adjunte una función al pasar el mouse / hacer clic
  4. Una vez que el usuario hace clic / pasa el mouse, muestra la descripción clonada en una ventana emergente (si es más texto y rompería el diseño)

Dependiendo de sus necesidades, en lugar de esto, puede envolver el exceso de caracteres en un lapso y ocultarlos. Una vez que haga clic en puntos suspensivos, puede aplicar otra clase al intervalo y mostrarlo.


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

Este código puede ayudarlo a lograr su objetivo.

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.