texto en columnas

[jcu]

Hola

Quisiera poner un texto de tamaño aleatori, que es llamado mediante una URL, en tres columnas tipo periódico, el texto de la primera columna continua en la segunda y esta en la tercera.

¿Se puede hacer con JavaScript? ¿Alguien me puede ayudar?

Gracias por anticipado y un cordial saludo
Juan Carlos

[Mostlair]

Poder se puede. ¿Tenés idea de Javascript? Si pasas todo a un string, ves su propiedad lenght y la dividis por tres podrias usarlo para, con el método subcad (creo que era así) dividir el texto, tendrias que escribir un poco de codigo HTML desde Javascript (en tablas) para la disposicion en columnas.

[jcu]

Hola

Gracias por contestar.

¿Podrías poner algún código para ver como se hace? Algo de JavaScript si se, pero poco.

Muchas gracias de nuevo
Juan Carlos

[Mostlair]

Buenas: tardé pero logré un código que funciona bastante bien. Te permite elegir la cantidad de columnas (primer parámetro) y podés ingresar saltos de linea terminando las palabras con '*'. Para los saltos de linea fijate que el asterisco debe estar PEGADO, es decir, sin espacios, luego de la última palabra antes del salto. Si antes del salto hay un signo de puntuación o un caracter especial, simplemente pon el asterisco después del signo de puntuación, sin espacio en el medio.

Te dejo la función y un ejemplo de llamada para que veas. Fijate como se comporta y si te sirve:

La función es la siguiente:

Código:

function EscribirEnColumnas (cantCol,Texto) {
  var long = Texto.length;
  var arrayAux = Texto.split('*');
  var cantAsteriscos = arrayAux.length - 1;
  long -= cantAsteriscos;
  var subLong = Math.floor(long/cantCol);
  var diferencia = long - subLong * cantCol;
  var arrayPalabras = Texto.split(' ');  
  var palabra = '';                      
  var contLetras = 0; 
  var limite = 0;
  var j = 0;
  var palabraAux, caracter, cantCar, cantCarAux;
  document.write('<table><tr>');
  for (var i=1; i<=cantCol; i++) { 
    document.write('<td width="33%">');
    limite += subLong;
    if (i == 1) limite += diferencia;
    while (contLetras<limite) {      
      palabra = arrayPalabras[j];
      cantCar = palabra.length;
      cantCarAux = cantCar -1;
      caracter = palabra.substring(cantCarAux);
      if (caracter == '*') { 
        palabraAux = palabra.substring(0, cantCarAux);
        document.write (palabraAux + '<br>');
        contLetras += palabraAux.length;
        contLetras++;
      }
      else {			
        document.write(palabra + ' ');
        contLetras += palabra.length;
        contLetras ++;
      }
      j++;
    }
    document.write('</td>');
  }
  document.write('</tr></table>');
}

Para llamarla tenés que pasarle el texto como argumento y también la cantidad de columnas en que querés que se acomode. Tené cuidado de no dejar saltos de linea en el texto que pasás como parámetro, pues IE considera la instrucción terminada cuando encuentra el salto y te va a dar varios errores. Acá te dejo el ejemplo con el que probé la función:

Código:

EscribirEnColumnas (3,'Esto es un texto de prueba, logicamente tiene que aparecer todo acomodadito en bellas columnas. Para ver que se acomode tengo que poner un texto largo, pues si no el efecto no es notorio, asi que hay que completar, es decir, más bien, rellenar con cosas que en realidad no son necesarias (como contenido) pero 12345 ... y qué?' Se viene una tormeta:* mejor que saque la ropa de la soga!);

document.write('<br><br>'); 

EscribirEnColumnas (3,'Esto es un texto de prueba, logicamente tiene que aparecer todo acomodadito en bellas columnas.* Para ver que se acomode tengo que poner un texto largo, pues si no el efecto no es notorio, asi que hay que completar, es decir, más bien, rellenar con cosas que en realidad no son necesarias (como contenido) pero bla bla bla ... y qué?* Se viene una tormeta:* mejor que saque la ropa de la soga!');

La primera no tiene saltos de linea y la segunda tiene algunos, lo usé para ver como se comportaba la función en las dist. llamadas.

Ojo que el único marcado HTML que está preparado para soportar este script es el salto de linea <br> y lo hace con un código propio. Podés incluir otros pero los tenés que separar con espacios a los dos lados, e igual te va a traer problemas con los tamaños de las columnas.

Puede ser que las columnas estén desparejas si alguna parte del texto concentra mayor cantidad de saltos de linea, es porque no divide por lineas de texto, pero hacer eso es muy complicado. Si te trae problemas busca alguna forma de marcar manualmente el fin de cada columna con algún caracter especial, eso te permitiría acomodar las columnas a gusto.

Lo que le faltaría al script es incluirle algunos estilos, especialmente el justificado del texto, pero no recuerdo bien como es.

Para terminar: Netscape soporta el HTML MULTICOL, es una etiqueta propietaria que acomoda el texto en su interior en columnas. Le tenés que poner el atributo COLS='cant' con la 'cant' de columnas que deseas, y tiene otro parámetro pero no recuerdo su nombre ni su uso. Si te sirve buscalo o pregunta acá, en el foro.

Suerte

[jcu]

Ante todo muchas gracias por la respuesta. Probaré el código que has puesto.

Ahora mismo estoy utilizando un código que me paso otro buen amigo de la Red

var texto="Texto a poner en columnas";
// Substituimos los retornos de carro por <br>
re = /\r/gi;
ra = /\n/gi;
texto=texto.replace(re,"");
texto=texto.replace(ra," </p><p align=justify>");
var descr_arr=new Array();
descr_arr=texto.split(" ");
var total_palabras=descr_arr.length;
var tamanio_bloque=total_palabras/2;
var ancho=parseInt(100/2);
var contador=0;
var num_bloque=0;
var bloques=new Array("");
for (var k=0;k<total_palabras;k++){
if (contador < tamanio_bloque){
contador++;
} else {
num_bloque++;
bloques[num_bloque]="";
contador=0;
}
bloques[num_bloque]+=descr_arr[k]+" ";
}
document.write("<table width='100%' cellspacing='15'><tr valign=top>");
for (var k=0;k<=num_bloque;k++){
document.write("<td width='"+ancho+"%'><P align='justify'>"+"<font size='2' color='black' face='Arial'>"+bloques[k]+"</font></P></td>");
}
document.write("</tr></table>");


Aquí lo dejo por si le puede servir a alguien.

Un saludo
Juan Carlos