Ajustar texto

Programadorpollo · #1 (**permalink**) 22/10/2012, 16:41

Buenas la verdad esto no se donde va porque tengo un poco de enredos en mi cabeza.

Lo que necesito hacer es lo siguiente, un sistema de publicaciones como el de facebook, osea el usuario digita lo que va a publicar y eso y lo publica y aparece en la pag principal.

Pero mi problema es ajustar el texto

Osea lo que necesito es por ejemplo el texto que escribe es de 50 lineas.

Y el max-height del div soporta 25 lineas.

Como hago para que cuando valla en la linea 25 al final en vez de seguir mostrando salga algo como:

Linea 25: Y las rosas se veian tan bien.... Ver mas.

Osea que en vez de mostrarse todas las 25 lineas faltantes salgan unos 3 puntos y salga "Ver mas"

Y Pues ese ver mas iria a otra pagina. un <a>

flashmax · #2 (**permalink**) 22/10/2012, 16:49

hola te dejo un ejemplo haber si te sirve

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<style type="text/css">
#div {

	
}
</style>
<script type="text/javascript">
var texto_original = '';
function gestionarTexto(div)
{
//aquí valoramos si hay que expandir o contraer el texto, en función de lo que ponga en el <DIV>
if(div.innerHTML == 'Volver')
{contraer();div.innerHTML='Leer más';}
else
{expandir();div.innerHTML='Volver'}
}
function contraer()
{
//vamos a limitar el texto a 50 caracteres y guardamos el texto original
texto_original = document.getElementById('el_div').innerHTML;
document.getElementById('el_div').innerHTML = texto_original.substring(0,50) + '...';
}
function expandir()
{
document.getElementById('el_div').innerHTML= texto_original;
}
</script>
</head>

<body onload="contraer();">

<table width="200px">
<tr>
<td>
<div id="el_div">
JavaScript fue desarrollado originalmente por Brendan Eich de Netscape con el nombre de Mocha, el cuál fue renombrado posteriormente a LiveScript, para finalmente quedar como JavaScript. El cambio de nombre coincidió aproximadamente con el momento en que Netscape agregó soporte para la tecnología Java en su navegador web Netscape Navigator en la versión 2.003 en diciembre de 1995. La denominación produjo confusión, dando la impresión de que el lenguaje es una prolongación de Java, y se ha caracterizado por muchos como una estrategia de mercadotecnia de Netscape para obtener prestigio e innovar en lo que eran los nuevos lenguajes de programación web.5 6
«JavaScript» es una marca registrada de Oracle Corporation. Es usada con licencia por los productos creados por Netscape Communications y entidades actuales como la Fundación Mozilla.7
Microsoft dio como nombre a su dialecto de JavaScript «JScript», para evitar problemas relacionadas con la marca. JScript fue adoptado en la versión 3.0 de Internet Explorer, liberado en agosto de 1996, e incluyó compatibilidad con el Efecto 2000 con las funciones de fecha, una diferencia de los que se basaban en ese momento. Los dialectos pueden parecer tan similares que los términos «JavaScript» y «JScript» a menudo se utilizan indistintamente, pero la especificación de JScript es incompatible con la de ECMA en muchos aspectos.
Para evitar estas incompatibilidades, el World Wide Web Consortium diseñó el estándar Document Object Model (DOM, o Modelo de Objetos del Documento en español), que incorporan Konqueror, las versiones 6 de Internet Explorer y Netscape Navigator, Opera la versión 7, Mozilla Application Suite y Mozilla Firefox desde su primera versión.[cita requerida]
En 1997 los autores propusieron8 JavaScript para que fuera adoptado como estándar de la European Computer Manufacturers 'Association ECMA, que a pesar de su nombre no es europeo sino internacional, con sede en Ginebra. En junio de 1997 fue adoptado como un estándar ECMA, con el nombre de ECMAScript. Poco después también como un estándar ISO.</div>
<br />
<div style="font-family:Courier New;font-size:8pt;color:Blue;cursor:pointer" onclick="gestionarTexto(this);" id="mas">Leer más</div>
</td>
</tr>
</table>
</body>
</html>

Programadorpollo · #3 (**permalink**) 22/10/2012, 17:05

Muchas gracias parcero, jajaja me ayudaste mucho estaba estancado en eso:s