Foros del Web » Creando para Internet » CSS »

Problemas con css

Estas en el tema de Problemas con css en el foro de CSS en Foros del Web. Muy buenas, abro este tema para preguntar una duda que nos ha surgido al implementar un sistema de votaciones apra nuestra pagina web. El resultado ...
  #1 (permalink)  
Antiguo 08/04/2009, 10:03
 
Fecha de Ingreso: noviembre-2008
Mensajes: 11
Antigüedad: 9 años
Puntos: 1
Problemas con css

Muy buenas, abro este tema para preguntar una duda que nos ha surgido al implementar un sistema de votaciones apra nuestra pagina web. El resultado final se puede observar aqui:

mimandote.com/videos/679-largo-viaje-humo-por-tus-pulmones


La cuestion es que el sistema de votaciones funciona perfectamente con
firefox y con safari, pero con explorer 6 y 7 tiene un fallo que
deseamos subsanar (en el 8 si funciona). Cuando pasamos por encima de
los remolinos cambian de color, pero al retroceder no pasan de color mas
oscuro a clarito (digamos que no desselecciona), no sabemos por que
puede ser (maldito explorer). Si a alguien se le ocurre alguna idea le
estaria muy agradecido.

Cuando el cursor pasa por encima de unno de los remolinos se realia una
llamada por AJAX:
<ul class='star-rating'>
.
.
.
<%= link_to_remote( " ", :url => votar_video_ajax_path(video.id, i),
:method => :post, :html => { :class => "star#{i}", :name => "#{i} stars
out of 5" }) %>

.
.
.
<ul/>
Este es el css que usamos:

.video-y-control {
margin-bottom:30px;
}
.bloque-video {
float:left;
}
.titulo-video-sin-imag, .titulo-video-sin-imag a {
color:#F92F1E;
}
.titulo-video-sin-imag {
font-size:16px;
padding-bottom:6px;
}
.opciones-video{
padding:30px 0 0 320px;

}
.opciones-video-show{
padding:30px 0 0 510px;

}


/* ESTILOS PARA LAS ESTRELLAS DE LOS VIDEOS */
.star-rating{
float:left;
list-style:none;
margin: 0;
padding:0;
width: 150px;
height: 30px;
position: relative;
background: url(/images/star_rating.gif) top left repeat-x; /*Aqui esta
toda la barra*/
}
.star-rating li {
padding:0;
margin:0;
float: left;
position: absolute;
height: 30px;
}
.star-rating li a {
display:block;
width:30px;
height: 30px;
text-decoration: none;
text-indent: -9000px;
z-index: 20;
position: absolute;
padding: 0px;
}
.star-rating li a:hover {
background: url(/images/star_rating.gif) left bottom;
z-index: 2;
left: 0px;
border:none;
}
.star-rating a.one-star, a.star1{
left: 0px;
}
.star-rating a.one-star:hover, a.star1:hover, .voto1 {
width:30px;
}
.star-rating a.two-stars, a.star2{
left:30px;
}
.star-rating a.two-stars:hover, a.star2:hover, .voto2 {
width: 60px;
}
.star-rating a.three-stars,a.star3{
left: 60px;
}
.star-rating a.three-stars:hover, a.star3:hover, .voto3 {
width: 90px;
}
.star-rating a.four-stars, a.star4{
left: 90px;
}
.star-rating a.four-stars:hover, a.star4:hover, .voto4 {
width: 120px;
}
.star-rating a.five-stars, a.star5{
left: 120px;
}
.star-rating a.five-stars:hover, a.star5:hover, .voto5 {
width: 150px;
}
.star-rating li.current-rating{
background: url(/images/star_rating.gif) left bottom;
position: absolute;
height: 30px;
display: block;
text-indent: -9000px;
z-index: 1;
}
.votos_rating {
margin: 0;
padding:0;
width: 150px;
height: 30px;
background: url(/images/star_rating.gif) top left repeat-x; /*Aqui
esta toda la barra*/
z-index: 3;
}
.voto1, .voto2, .voto3, .voto4, .voto5 {
background: url(/images/star_rating.gif) left bottom;
z-index: 2;
height: 30px;
left: 0px;
}

.info_rating {
/*float:left;*/
padding-top:11px;
margin-left:325px;
color:#C334BE;
font-size:16px;

}



Estaria muy agradecido si alguien nos pudiera comentar como fijar este bug, ya que gran parte de nuestros visitantes usan IE6
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 01:58.