Cómo crear un botón "mostrar más" y especificar cuántas líneas de texto se pueden mostrar inicialmente

Estoy buscando una manera de crear una función 'mostrar más' deslizable en mi sitio sensible, que se corta después dedos lineas de un párrafo.

He logrado esto antes con un sitio web estático, aplicando una altura determinada al contenedor y utilizandooverflow: hidden, y luego animando la altura del contenedor.

Pero al ser receptivo, el contenedor aplasta el texto en diferentes anchos de navegador, por lo que el texto puede ocupar más / menos espacio. También puede haber contenido diferente sobre el párrafo cada vez que lo presionas hacia abajo. Así que el escenarioheight podría no cubrir dos líneas exactamente.

Por favor, echa un vistazo a este jsFiddle:http://jsfiddle.net/XVAzU/ si necesita demostrar

Por lo tanto, debo cortar después de dos líneas del párrafo, sin importar el ancho del contenedor o lo que viene antes o después de ese párrafo.

¡Gracias por mirar!

Respuestas a la pregunta(2)

Su respuesta a la pregunta