Problemas con varios Divs y javascript

Burrako · #1 (**permalink**) 18/08/2009, 07:54

Hola a todos, estoy utilizando una function de javascript para que el texto de la web pueda aumentar o reducir. En mi caso hay 3 tipos de tamaños, representados por 3 "Aes" (A A A) cada una con un tamaño, para que sea más ilustrativo para el usuario.

La función que utilizo es la siguiente:

<script language="javascript">
function tamFuente (nivel, elem) {
var elemento = document.getElementById(elem)
elemento.className = "nivel"+nivel;
}
</script>

Luego en cada una de las "Aes" coloco la siguiente llamada:

<href="javascript:tamFuente(1,'contenido')"/>
<href="javascript:tamFuente(2,'contenido')"/>
<href="javascript:tamFuente(3,'contenido')"/>

Hay 3 estilos creados, llamados nivel1, 2 y 3, y tan sólo con darle el id="contenido" al DIV funciona correctamente.

Hasta ahí todo perfecto, el problema es que tengo varios divs en la tabla, y claro, no puedo ponerle a todas la id "contenido" porque sabemos que no funciona, hay alguna forma de poder añadir más ids de divs a las 3 llamadas de la funcion?

He probado muchas cosas, del estilo de:

<href="javascript:tamFuente(1,'contenido','conteni do2')"/> ---> dandole el id "contenido2" a otra div que hay, pero nada de nada.

En este caso con 4 divs las que tengo, pero supongo que averiguando la forma de que funcione para 2, ya podré yo mismo hacer que funcione para el nº que desee.

Alguna idea chicos? Estoy algo perdido...

Gracias

posman · #2 (**permalink**) 18/08/2009, 08:14

Y porque no la mandas llamar con el 2o parametro como un arreglo:

Código:

<href="javascript:tamFuente(1,['contenido','contenido2'])"/>

y en la funcion tamFuente recorres ese arreglo

Burrako · #3 (**permalink**) 18/08/2009, 08:35

Hola Posman, he probado eso pero no tengo muy claro como tengo que arreglar la función:

<script language="javascript">
function tamFuente (nivel, [elem]) {
var elemento = document.getElementById(elem)
elemento.className = "nivel"+nivel;
}
</script>

Te refieres a poner entre [] el "elem"?

El href ya lo he arreglado tal y como tu lo has puesto, pero poniendo la funcion como te he puesto arriba no funciona... ya te digo que igual no lo estoy haciendo bien.

Burrako · #4 (**permalink**) 18/08/2009, 10:46

Plisss, una ayudita!

goyo_ · #5 (**permalink**) 18/08/2009, 11:47

Cita:

Iniciado por Burrako

Plisss, una ayudita!

Esta es mi aportacion:

Código HTML:

<body>

<style>
#chico, .chico {font-size: 12px;}
#mediano, .mediano {font-size: 18px;}
#grande, .grande {font-size: 24px;}
</style>

<a href="#" id="chico">A</a>
<a href="#" id="mediano">A</a>
<a href="#" id="grande">A</a>

<p>Hola mundo! Como se encuentran?</p>

<script>
var a = document.getElementsByTagName('a'),
    l = a.length;
    
while (l--) {
	a[l].onclick = function() {
		document.body.className = this.id;
		return false;	
	}
}
</script>

</body>

Puedes reemplazar document.body con el contenedor maestro de tu pagina por ejemplo document.getElementByiD('contenedor'); y filtrar el registro del evento click unicamente a esos 3 links, e.g. inmediatamente dentro del while loop, pon: if (a[l].className === 'manipularFuente'), depsues arriba <a href="#" id="chico" class="manipularFuente">A</a>

Burrako · #6 (**permalink**) 26/08/2009, 11:31

Lo siento chicos, la verdad es que no me entero de nada... Lo pruebo todo pero no me funcionan las cosas... Hasta ahora lo que mejor me funcionaba era lo que yo había hecho, el único problema era que no funcionaba en más de 1 div a la vez. Alguien sería tan amable de ayudarme a arreglar lo que yo estaba haciendo? Agradezco mucho la aportación de goyo_, pero no hago más que liarme más y más.

Alguien puede decirme en qué consiste ese "arreglo" que comentan más arriba y terminar de hacer funcionar la función que he creado para que funcione en más de un div? Ya sea con [ ] o con otra herramienta? Esque irme a otro código totalmente diferente sólo va a empeorar las cosas por aquí...

Disculpad mi ignorancia... pero os agradecería muchísimo una ayudita, por favor.

Abrazos

zerokilled · #7 (**permalink**) 26/08/2009, 11:50

a lo que posman se referia era que el segundo parametro es un array de ID's de modo que en la funcion recorres el array con un bucle. y la operacion es basicamente lo que estas haciendo para un solo DIV, pero ahora utilizando el array.

Código:

function tamFuente (nivel, elem) {
while(elem.length) document.getElementById(elem.shift()).className = "nivel"+nivel;
}

como ya habia mencionado, el segundo parametro es una lista de ID's y la utiliza una de las dos formas:

Código:

<a href="#" onclick="tamFuente(1, ['contenido', 'contenido2', 'contenido3', ...]); return false;">A</a>

<a href="#" onclick="tamFuente(1, new Array('contenido', 'contenido2', 'contenido3', ...)); return false;">A</a>