Si ya lo conoces todo sobre los estilos de tusencuestas.com, puede que te surja la gran duda: ¿Cómo tener en una misma página varias encuestas con diferentes estilos?
El ejemplo típico lo tenéis en la propia página principal de tusencuestas.com, desde donde se pueden encontrar tres encuestas con estilos totalmente diferentes.
Bien, pues sí es posible tener varias encuestas con estilos diferentes, pero al ser una funcionalidad avanzada, el modo de proceder es también avanzado.
Fijándonos en el código típico de una encuesta, tenemos:
<script type="text/javascript" src="http://www.tusencuestas.com/Acciones/tusencuestas.aspx?63-45-0-0-067f9024_ea9e_4709_8999_6c0bf4e1285c-0-0"> </script>
Y fijándonos en los parámetros tenemos (separados por '-'):
63-45-0-0-067f9024_ea9e_4709_8999_6c0bf4e1285c-0-0
En nuestro caso, los parámetros que nos importan son el 5º (067f9024_ea9e_4709_8999_6c0bf4e1285c) y el 6º (0)
Para habilitar varios estilos a varias encuestas, no hay más que cambiar el 6º parámetro de 0 a 1.
Una vez hecho esto, hay que cambiar el nombre de las clases CSS desde su nombre habitual, a él mismo seguido de un '_' y el quinto parámetro. Es decir, hay que cambiar todas las clases CSS desde:
.tusencuestas_encuesta
hasta
.tusencuestas_encuesta_067f9024_ea9e_4709_8999_6c0bf4e1285c
De modo que un ejemplo de estilos para este caso en concreto, sería
<style>
.tusencuestas_encuesta_067f9024_ea9e_4709_8999_6c0bf4e1285c
{
font-family: verdana;
padding: 4px;
margin-right: 10px;
border: 1px solid black;
background-color: #ffff99;
}
.tusencuestas_pregunta_067f9024_ea9e_4709_8999_6c0bf4e1285c
{
font-weight: bold;
padding: 2px;
border: 1px solid black;
background-color: yellow;
}
.tusencuestas_respuestas_067f9024_ea9e_4709_8999_6c0bf4e1285c
{
padding: 2px;
}
.tusencuestas_myBar_067f9024_ea9e_4709_8999_6c0bf4e1285c
{
background-color: Yellow;
border: solid 1px black;
}
.tusencuestas_myBar_1_067f9024_ea9e_4709_8999_6c0bf4e1285c
{
background-color: Orange;
}
.tusencuestas_myBar_3_067f9024_ea9e_4709_8999_6c0bf4e1285c
{
background-color: Red;
}
.tusencuestas_myBar_4_067f9024_ea9e_4709_8999_6c0bf4e1285c
{
background-color: Blue;
}
.tusencuestas_inferior_067f9024_ea9e_4709_8999_6c0bf4e1285c
{
font-size: 10px;
color: Blue;
text-align: center;
}
input.tusencuestas_inferior_067f9024_ea9e_4709_8999_6c0bf4e1285c
{
font-family: verdana,tahoma,sans-serif;
font-size: 10px;
color: black;
text-decoration:normal;
border: 1px groove black;
}
</style>