Campo de altura fija con "Ver mas"

[hermess87]

Hola amigos, vengo con una inquietud, quizás ustedes puedan ayudarme con alguna idea o código que pueda serme útil. Necesito que un div que contiene texto (extraído de una tabla en la bd) de una extensión indeterminada, después de cierta cantidad de caracteres o medida máxima del div agregue un enlace que diga "Ver mas", con el cual al hacer click se expanda la caja con slideDown o algun efecto...

Espero puedan ayudarme, desde ya muchas gracias y suerte!

[Perr0]

algo asi podria ayudarte

Código Javascript:

<script> 
var texto;
var mas="<a href='javascript:vermas(0)'>ver mas</a>";
var men="<a href='javascript:vermas(1)'>ver menos</a>";
 
texto="<h2>¿Que es JavaScript ?</h2>";
texto=texto+"JavaScript es un lenguaje interpretado orientado a las páginas web, con una sintaxis semejante a la del lenguaje Java.<br>";
texto=texto+"El lenguaje fue inventado por Brendan Eich en la empresa Netscape Communications, que es la que fabricó los primeros navegadores de Internet comerciales.<br>";
texto=texto+"Apareció por primera vez en el producto de Netscape llamado Netscape Navigator 2.0.<br>";
texto=texto+"Se utiliza en páginas web HTML, para realizar tareas y operaciones en el marco de la aplicación cliente.<br>";
texto=texto+"Los autores inicialmente lo llamaron Mocha y más tarde LiveScript pero fue rebautizado como JavaScript en un anuncio conjunto entre Sun Microsystems y Netscape, el 4 de diciembre de 1995.<br>";
texto=texto+"En 1997 los autores propusieron JavaScript para que fuera adoptado como estándar de la the 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 lo fue como un estándar ISO.<br>";
texto=texto+"JScript es la implementación de ECMAScript de Microsoft, muy similar al JavaScript de Netscape, pero con ciertas diferencias en el modelo de objetos del navegador que hacen a ambas versiones con frecuencia incompatibles.<br>";
texto=texto+"Para evitar estas incompatibilidades, el World Wide Web Consortium diseñó el estándar Document Object Model (DOM, ó Modelo de Objetos del Documento en castellano), que incorporan las versiones 6 de Internet Explorer y Netscape Navigator, Opera versión 7, y Mozilla desde su primera versión.";
 
window.onload=function() {vermas(1);}
 
function vermas(o){
    textocorto=texto.substr(0,300)
    if(o==1) document.getElementById("text").innerHTML=textocorto+"..."+mas;
    if(o==0) document.getElementById("text").innerHTML=texto+"..."+men;
}
</script>
 
<div id="text">
</div>
 

la idea es que traigas el texto de una base y se lo asignes a la variable texto como variable javascript

si quieres subo un ejemplo

salu2

[hermess87]

Me funciono perfecto!!! lo adapte a mi sitio y ya lo tengo funcionando!! Mil gracias perr0!

Cualquier cosa estoy para ayudarte!

[Perr0]

no problema

le hice un pequeño arreglo

Código Javascript:

var largo=300;
function vermas(o){
    var t=document.getElementById("text")
    if(texto.length>largo){
        textocorto=texto.substr(0,largo);
        if(o==1) t.innerHTML=textocorto+"..."+mas;
        if(o==0) t.innerHTML=texto+"..."+men;
    }else
    t.innerHTML=texto
}
 

lo que haces es que si el numero de texto es menor al delimitado, no aparesca la opción (obvio, no tienes mas que mostrar)

salu2