| Ver tema anterior :: Ver siguiente tema |
| Autor |
Mensaje |
maquetacion
Nuevo Miembro
Registrado: 23 Jul 2008
Mensajes: 4
|
 Publicado: Mie Jul 23, 2008 11:34 am Título del mensaje: Aplicar "Leer mas..." a más de un texto en la mism |
 |
|
Hola,
Tengo un problema al truncar textos de mi página según explica en la página http://www.extremaweb.com/blog/noticia1179677540a---.html
El caso es que tengo diversos textos, cada uno en su tabla correspondiente. Funciona perfectamente en el primer texto, pero no en los siguientes. Pongo al principio del html, dentro de la etiqueta body: <script type="text/javascript" src="leermas.js"></script>
Después en cada párrafo pongo el correspondiente <p id="truncateMe"> aquí mis textos <p>
He probado a poner en diversos sitios las etiquetas script, por si ese fuera el problema, pero no tengo resultados.
No soy un experto en javascript, simplemente he seguido los pasos que indica el tutorial. Alguien me podría ayudar?
Gracias por adelantado |
|
| Volver arriba |
|
 |
Smart
User destacando
Registrado: 02 Oct 2007
Mensajes: 282
Ubicación: Super Colombia!
|
| Publicado: Mie Jul 23, 2008 1:33 pm Título del mensaje: |
|
|
Hola,
Coloca tu código para ayudarte mejor... por que así no se que haga el script...
_________________
Copiar ideas de uno es plagio, copiar ideas de muchos es la investigación...! |
|
| Volver arriba |
|
|
maquetacion
Nuevo Miembro
Registrado: 23 Jul 2008
Mensajes: 4
|
| Publicado: Jue Jul 24, 2008 9:09 am Título del mensaje: |
|
|
Los textos están colocados en tablas como la siguiente. Resumo el texto para no llenar demasiado de texto
<table width="100%" border="0" cellpadding="10">
<tr>
<td bgcolor="ffcccc" class="Texto"><p><span class="style6">KENWOOD</span> NOVEDAD </p>
<p class="titulosEntrada">DNX8220BT: <br>
NAVEGACIÓN 'TODO-EN-UNO'</p>
<p id="truncateMe">Kenwood lanza el DNX8220BT, un dispositivo “todo en uno” que incorpora audio, vídeo, navegación y Bluetooth para manos libres.<br>La principal característica de este reproductor es su imponente pantalla de 6,95’’, con función táctil, sistema antirreflejante e inclinación ajustable, que nos permite disfrutar en toda su extensiónSu conectividad también es destacable, con dos USB, dos entradas AV y una salida de previo de 5.1. Su PVPR es de 1.500 euros.</p></td>
<td width="100" valign="top" bgcolor="ffcccc" class="Texto"><img src="imagenes/Empresas/Noticias/novedadKenwood.jpg" alt="KENWOOD" width="100" height="100"></td>
</tr>
</table>
Y pongo:
<script language="JAVASCRIPT" type="text/javascript" src="leermas.js"></script>
al principio, dentro de la tabla que contiene todas las tablas de los textos. Lo he puesto en varios sitios, por si era esta el problema, pero no veo cambios.
El javscript "leermas" está tal cual dice la página, sólo e cambiado la longitud del corte, de 100 a 140 caracteres.
Muchas gracias! |
|
| Volver arriba |
|
|
Smart
User destacando
Registrado: 02 Oct 2007
Mensajes: 282
Ubicación: Super Colombia!
|
| Publicado: Jue Jul 24, 2008 5:55 pm Título del mensaje: |
|
|
Bueno mira,
Segun lo que estuve mirando, esta parte del codigo JS
| Código: |
| var p = document.getElementById('truncateMe'); |
esta haciendo referencia a la etiqueta o elemento que tiene el Id 'truncateMe' entonces como tu colocas el mismo id para varias etiquetas entonces te va a generar un error... me entiendes...
Entonces debes cambiar la forma de identificar el p al cual deseas hacerle el truncate....
Mira debes cambiar en el archivo js algo asi:
| Código: |
function truncate(p) {
var len = 100;
if (p) {
var trunc = p.innerHTML;
if (trunc.length > len) {
/* Truncate the content of the P, then go back to the end of the
previous word to ensure that we don't truncate in the middle of
a word */
trunc = trunc.substring(0, len);
trunc = trunc.replace(/\w+$/, '');
/* Add an ellipses to the end and make it a link that expands
the paragraph back to its original size */
trunc += '<a href="#" ' +
'onclick="this.parentNode.innerHTML=' +
'unescape(\''+escape(p.innerHTML)+'\');return false;">' +
'<span style="font-size: 10px;">[ Leer mas ... ]</span><\/a>';
p.innerHTML = trunc;
}
}
}
// Multiple onload function created by: Simon Willison
// http://simon.incutio.com/archive/2004/05/26/addLoadEvent
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
if (oldonload) {
oldonload();
}
func();
}
}
}
|
Y luego llamas la función así:
| Código: |
| <script language="JAVASCRIPT" type="text/javascript" src="leermas.js">truncate('P')</script> |
Donde P es el Id de la etiqueta donde esta el texto que deseas truncar....
Bueno espero te sirva... la verdad no he probado el código pero eso lo debes hacer tu... me cuentas si te funciona... Ok!
Saludos XD
_________________
Copiar ideas de uno es plagio, copiar ideas de muchos es la investigación...! |
|
| Volver arriba |
|
|
maquetacion
Nuevo Miembro
Registrado: 23 Jul 2008
Mensajes: 4
|
| Publicado: Vie Jul 25, 2008 10:34 am Título del mensaje: |
|
|
Hola,
No sé por qué, pero no funciona. A ver si lo he hecho bien. He puesto el código en el archivo "leermas.js" tal y como me indicas, y después he hecho en mi página lo siguiente (perdona, no sé cómo poner el código en el formato correcto y lo tengo que pegar aquí seguido)
<p id="BECKER">Becker ha presentado su nuevo modelo de navegador Z200,
que destaca por ser el primer modelo de la marca que
incorpora un GPS Instant Fix II mucho más sensible
que los anteriores, capaz de ofrecer un posicionamiento
instantáneo solo con encenderlo. Este modelo también
cuenta con una pantalla partida de 4’3’’ que
permite al conductor ver al mismo tiempo el itinerario
y la dirección a seguir en la próxima intersección
con la que se encuentre.</p>
<script language="JAVASCRIPT" type="text/javascript" src="leermas.js">truncate('BECKER')</script>
Lo he hecho bien?
Saludos y gracias por tu colaboración! |
|
| Volver arriba |
|
|
Smart
User destacando
Registrado: 02 Oct 2007
Mensajes: 282
Ubicación: Super Colombia!
|
| Publicado: Vie Jul 25, 2008 1:59 pm Título del mensaje: |
|
|
Listo, que pena contigo se me paso por alto unas cosas, pero es que ayer te respondí de memoria y como te dije no lo probé...
Bueno el nuevo código de leermas.js, seria asi:
| Código: |
/* This script and many more are available free online at
The JavaScript Source!! http://javascript.internet.com
Created by: Patrick Fitzgerald | http://www.barelyfitz.com/ */
Editado por: Carlos J. Caro (Smart) http://carloscaro.atwebpages.com
function truncate(id) {
var len = 100;
var p = document.getElementById(id);
if (p) {
var trunc = p.innerHTML;
if (trunc.length > len) {
/* Truncate the content of the P, then go back to the end of the
previous word to ensure that we don't truncate in the middle of
a word */
trunc = trunc.substring(0, len);
trunc = trunc.replace(/\w+$/, '');
/* Add an ellipses to the end and make it a link that expands
the paragraph back to its original size */
trunc += '<a href="#" ' +
'onclick="this.parentNode.innerHTML=' +
'unescape(\''+escape(p.innerHTML)+'\');return false;">' +
'<span style="font-size: 10px;">[ Leer mas ... ]</span><\/a>';
p.innerHTML = trunc;
}
}
} |
Y debes colocar antes de la etiqueta body lo siguiente:
| Código: |
| <script type="text/javascript" src="Leer.js"></script> |
Y debajo de cada P o etiqueta que necesites truncar o recortar debes escribir lo siguiente:
| Código: |
<script type="text/javascript">
truncate('truncate');
</script> |
Donde truncate es el Id de la etiqueta que quieres truncar...
Yo mismo lo probe y me funciono a la perfeccion hasta con 5 etiquetas P
Saludos XD
_________________
Copiar ideas de uno es plagio, copiar ideas de muchos es la investigación...! |
|
| Volver arriba |
|
|
maquetacion
Nuevo Miembro
Registrado: 23 Jul 2008
Mensajes: 4
|
| Publicado: Lun Jul 28, 2008 12:06 pm Título del mensaje: |
|
|
MUCHÍSIMAS GRACIAS!
Me ha funcionado perfecto con esta modificación. Tengo como unas 20 etiquetas y todas funcionan a la perfección.
Un abrazo y reitero mi agradecimiento! |
|
| Volver arriba |
|
|
Smart
User destacando
Registrado: 02 Oct 2007
Mensajes: 282
Ubicación: Super Colombia!
|
| Publicado: Lun Jul 28, 2008 3:07 pm Título del mensaje: |
|
|
Ok, para eso estamos! XD
_________________
Copiar ideas de uno es plagio, copiar ideas de muchos es la investigación...! |
|
| Volver arriba |
|
|
|
|
|
