Ver Mensaje Individual
  #4 (permalink)  
Antiguo 30/10/2008, 15:26
furoya
(Desactivado)
 
Fecha de Ingreso: noviembre-2002
Ubicación: Ciudad Autónoma de Buenos Aires
Mensajes: 2.367
Antigüedad: 22 años, 1 mes
Puntos: 317
Respuesta: cuantos lineas de texto tengo en un div?

Empecé a escribir éste mensaje por lo menos 3 veces. Y cada vez aparecía algo más para comentar que me obligaba a reescribir lo anterior. Hago esta aclaración porque ya no pienso seguir editando, y dejo lo que tengo, que ahora puede ser un poco inconexo.

Primero y principal : muy bueno el código Panino5001, es de esos que a mi me gustán porque tiene 5001 cosas para desarmar y estudiar, más allá de la idea. (Bué, más o menos como todos los tuyos.)

Al verlo recordé algunos temas donde se trató el asunto desde distintas necesidades, y por supuesto los busqué para hacer el clásico post-ring que los uniera.

Me encontré con viejos ejemplos que puse y no actualicé. Hoy existen nuevos navegadores y DTDs, así que antes que nada empecé con eso.

Después sí, me dediqué a probar tu ejemplo ... y me pasó algo raro.

En Internet Explorer 7 —no sé en otras versiones— me agrega un caracter. Quiero decir, que no termina en la línea que corresponde sino en la siguiente, con una sola letra y no con toda la línea.

Como cortaste el texto con split(''), pensé que había un error en el bucle y contaba uno de más.
Pero no. Contaba bien, y en Firefox y Opera funciona perfecto.

En la nebulosa de mi memoria me pareció recordar que ya había visto algo así en alguna parte de otro invento de MSIE. Como estaba ya revisando mis viejos ejemplos, aproveché para buscar. Y lo encontré.
Era un código que bajé no sé de qué sitio, porque no guardé los créditos. Y ni falta que hacía, porque funcionaba tan mal que me puse a reescribirlo todo, así que ahora es mío .

En el momento ese "error" era muy útil, y yo creí que aparecía porque usaba TextRange(); pero parece que no. El efecto era una especie de lupa que aumentaba una copia del texto en una capa al pasarle el puntero palabra por palabra. Cuando llegábamos a la última de una línea, si seguíamos avanzando nos mostraba la palabra siguiente —que en realidad estaba abajo, en la próxima línea— y servía como referencia para bajar el puntero y encontrar por dónde seguir leyendo. Era una ayuda para personas con poca visión.

Y el error es el mismo. En este caso cuenta la siguiente letra como si estuviese en la misma línea, cuando en realidad ya está abajo.

Preparé una versión que corrige el problema con un hack para IE : resta un caracter . Usé otra forma de reponer el texto ya cortado, con substring(), pero basicamente es lo mismo.

Ya estaba haciendo los enlaces y copiando los códigos para postear acá (agrego uno que mencioné en uno de los links, y por razones personales no voy a postear en ese tema) cuando tuve la brillante idea de probar tu contador en Chrome.
Se come una línea entera.

Tiré todo, me harté de las incompatibilidades, que lo arregle otro.

Acá está la versión para IE. Le puse un mensaje para que se pueda seguir la evolución del escript; y reduje las medidas para que no se hiciera tan largo.

Código:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<title>test</title>
<script>
Array.prototype.inArray=function(el){
    for(var i=0,l=this.length;i<l;i++)
        if(this[i]==el)
            return true;
    return false;
}
onload=function(){
var i , txt='<span>'+ document.getElementById('ej').innerHTML.split('').join('</span><span>') +'</span>';
    document.getElementById('ej').innerHTML = txt;
    var t='';
    var cuenta=[];
    for(var i=0, l=document.getElementById('ej').getElementsByTagName('span'),ll = l.length;i<ll;i++){
        if(!cuenta.inArray(l[i].offsetTop))
            cuenta.push(l[i].offsetTop);
        if(cuenta.length<3){
            t+=l[i].innerHTML;

		alert(t+"|"+i+"\r\n"+cuenta)
}
        else break;
    }
    document.getElementById('ej').innerHTML = (navigator.userAgent.indexOf('msie') != -1)? t : t.substring(0,i-1);

}
</script>
</head>

<body>

<br />
<br />
<br />
<br />
<br />
<br />
<div id="ej" style="width:100px; height:200px; border:1px solid red;">Hola que tal necesito verdaderamente ayuda con esto!!!
Necesito cortar el texto a partir de la 5 ta linea de texto que tengo en un div, digamos q de la 6 ta linea inclusive en adelante lo tengo que cortar. GRACIAS</div>
</body>
</html>