JavaScript - Estrellas de valoración ¿algoritmo?

 
Vista:
sin imagen de perfil

Estrellas de valoración ¿algoritmo?

Publicado por german (5 intervenciones) el 06/04/2014 06:12:58
Hola,
Estoy aprendiendo a utilizar javascript para meterlo en XHTML de una app, pero no lo manejo nada, me hace falta un programita, que me parecía.... pero llevo un par de días y no lo doy sacado, va aquí el "algoritmo" de lo que necesito (no me vale que llamen a ninguna www) :

Tengo para HTML en mi archivo de imágenes tengo cinco estrellas coloradas(91.png) y otras cinco doradas(25.png).
Mi rutina va de los siguiente;
Cuando pulse la primera estrella, cambie de imagen y se ponga la imagen de la dorada y el resto coloradas.
Cuando pulse la segunda estrella,cambie de imagen y se ponga la que pulsé dorada, pero la primera también y el resto de las imagenes la estrella roja
Cuando pulse la tercera estrella, cambie de imagen y se ponga la tercera imagen de la dorada, pero la primera y la segunda también y el resto(4 y 5) la imagen de la estrella roja.
Cuando pulse la cuarta estrella roja, cambie de imagen y se ponga la que es dorada, pero las anteriores también y la quinta, la imagen de la colorada
Y cuando pulse la quinta todas las imágenes cambian a la estrella amarilla.

Una vez selecciónada la estrella (1,2,3,4 ó 5) y depués de darle a enviar, efectivamente envíe un correo elctrónico con su valor (1,2,3,4 o 5)

Ya veis que se trata de un sistema de valoración de estrellas, pero lo que he visto en WWW de pago y gratuitas se vuelven locos de complicación.

Si me he "pasao", ya me lo direis. Saludos. Y perdón por madrugar, pero es que no me deja pegar ojo.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder

Estrellas de valoración ¿algoritmo?

Publicado por bathorz (10 intervenciones) el 06/04/2014 10:50:04
La explicación es confusa.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
Op: opción
0: estrella dorada
1: estrella roja
 
--------------
Op | 1 2 3 4 5 <- estrellas
--------------
0  | 0 0 0 0 0   cero puntos
1  | 1 0 0 0 0
2  | 1 1 0 0 0
3  | 1 1 1 0 0
4  | 1 1 1 1 0
5  | 1 1 1 1 1   máximo puntaje
--------------
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

Estrellas de valoración ¿algoritmo?

Publicado por Germán (5 intervenciones) el 06/04/2014 14:41:35
Efectivamente, has sido mucho mas gráfico con el idem. Pues no se por donde empezar en JavaScript. Bueno, las condicionales las veo, pero sustituir los gráficos... necesitaría que el scr fuese variable.., cosa que aún no he conseguido con JavaScript.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

Estrellas de valoración ¿algoritmo?

Publicado por german (5 intervenciones) el 06/04/2014 21:56:03
Hecho y funcionando. Un poco tosco, seguramente, pero ahí lo dejo. //25 estrella amarilla, 91 estrella roja).

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<script type="text/javascript">
	function encenderunaestrella()
	{
		document.getElementById('Item1').src='25.png'
		document.getElementById('Item2').src='91.png'
		document.getElementById('Item3').src='91.png'
		document.getElementById('Item4').src='91.png'
		document.getElementById('Item5').src='91.png'
	}
	function encenderdosestrella()
	{
		document.getElementById('Item1').src='25.png'
		document.getElementById('Item2').src='25.png'
		document.getElementById('Item3').src='91.png'
		document.getElementById('Item4').src='91.png'
		document.getElementById('Item5').src='91.png'
	}
 
	function encendertresestrella()
	{
		document.getElementById('Item1').src='25.png'",1)
		document.getElementById('Item2').src='25.png'	
		document.getElementById('Item3').src='25.png'
		document.getElementById('Item4').src='91.png'
		document.getElementById('Item5').src='91.png'
	}

	function encendercuatroestrella()
	{
		document.getElementById('Item1').src='25.png'
		document.getElementById('Item2').src='25.png	
		document.getElementById('Item3').src='25.png'
		document.getElementById('Item4').src='25.png'
		document.getElementById('Item5').src='91.png'
	}

	function encendercincoestrella()
	{
		document.getElementById('Item1').src='25.png'
		document.getElementById('Item2').src='25.png'	
		document.getElementById('Item3').src='25.png'
		document.getElementById('Item4').src='25.png'
		document.getElementById('Item5').src='25.png'
	}
</script>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar