Foros del Web » Creando para Internet » CSS »

css no actúa en sistema de ratings en ie

Estas en el tema de css no actúa en sistema de ratings en ie en el foro de CSS en Foros del Web. Hola a todos/as. He diseñado finalmente un sistema de ratings propio para valorar noticias. es bastante sencillo pero da resultado. a modo de resumen os ...
  #1 (permalink)  
Antiguo 18/08/2010, 10:05
Avatar de estibaliz2006  
Fecha de Ingreso: noviembre-2006
Mensajes: 439
Antigüedad: 11 años, 1 mes
Puntos: 1
css no actúa en sistema de ratings en ie

Hola a todos/as. He diseñado finalmente un sistema de ratings propio para valorar noticias. es bastante sencillo pero da resultado. a modo de resumen os diré:

se compone de un archivo index.php que recoge el sistema, un archivo rating.css que recoge su funcionamiento visual en css y una conexión a la base de datos que obviaré porque para el problema que me ocupa no tiene relevancia. Bien. el sistema de estrellas sería este:

Código PHP:
<ul class="star-rating">
    <
li class="current-rating" style="width:75px;"> </li>
    <
li><a href="#" title="Pasable" class="one-star">1</a></li>
    <
li><a href="#" title="No está mal" class="two-stars">2</a></li>
    <
li><a href="#" title="Me gusta" class="three-stars">3</a></li>
    <
li><a href="#" title="Está Genial" class="four-stars">4</a></li>
    <
li><a href="#" title="Sobresaliente" class="five-stars">5</a></li>
</
ul
bien. esto tiene a la hora del diseño, un archivo css que sería rating.css que recogería los siguientes parámetros:

Código PHP:
    /*             estilos para el sistema de rating mediante estrellitas                */    
    
.star-rating{
        list-
style:none;
        
margin0px;
        
padding:0px;
        
width125px;
        
height25px;
        
positionrelative;
        
overflow:hidden;
        
backgroundurl(../imagenes/alt_star.giftop left repeat-x;        
    }
    .
star-rating li{
        
padding:0px;
        
margin:0px;
        
width:25px;
        
height:25px;
        
/*\*/
        
floatleft;
        
/* */
    
}
    .
star-rating li a{
        
display:block;
        
width:25px;
        
height25px;
        
line-height:25px;        
        
text-decorationnone;
        
text-indent: -9000px;
        
z-index20;
        
positionabsolute;
        
padding0px;
        
overflow:hidden;
    }
    .
star-rating li a:hover{
        
backgroundurl(../imagenes/alt_star.gifleft bottom;
        
z-index2;
        
left0px;
        
border:none;
    }
    .
star-rating a.one-star{
        
left0px;
    }
    .
star-rating a.one-star:hover{
        
width:25px;
    }
    .
star-rating a.two-stars{
        
left:25px;
    }
    .
star-rating a.two-stars:hover{
        
width50px;
    }
    .
star-rating a.three-stars{
        
left50px;
    }
    .
star-rating a.three-stars:hover{
        
width75px;
    }
    .
star-rating a.four-stars{
        
left75px;
    }    
    .
star-rating a.four-stars:hover{
        
width100px;
    }
    .
star-rating a.five-stars{
        
left100px;
    }
    .
star-rating a.five-stars:hover{
        
width125px;
    }
    .
star-rating li.current-rating{
        
backgroundurl(../imagenes/alt_star.gifleft center;
        
positionabsolute;
        
height25px;
        
displayblock;
        
text-indent: -9000px;
        
z-index1;
    }
    
    
/* elimina el efecto outline en firefox   */
    
a:active{
        
outlinenone;
    } 
Bien. hasta aquí todo correcto. según voy pasando el puntero por las estrellas (hasta cinco estrellas), se van iluminando o "activando". Eso funciona bien tanto en firefox como en ie.

Pero el problema viene en la primera línea del código de las estrellas. Si observan, hace referencia a

Código PHP:
<li class="current-rating" style="width:75px;"> </li
es decir, recoge la puntuación actual de cada noticia con un ancho que aquí he puesto como 75px pero que se determina mediante una serie de operaciones y consultas con la base de datos (que como digo obviaremos para ahorrar tiempo y no complicar el asunto).

esta puntuación actual lo que provoca es que se fijen de color rojo las estrellas hasta esa puntuación actual y a la vez, permitan seguir iluminándose las estrellas cuando pasan el puntero sobre ellas. pues bien. esta puntuación actual está recogida en el css mediante la clase "current-rating", que sorpresivamente no es ejecutada por ie. sabe alguien como hacer para que ie la reconozca?

gracias a todos
__________________
desgraciadamente no conozco php ni la mitad de lo que lo conocen ustedes y eso es menos de la mitad de lo que yo querria y lo que yo querria es menos de la mitad de lo que la mitad de ustedes conocen
  #2 (permalink)  
Antiguo 18/08/2010, 12:45
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: css no actúa en sistema de ratings en ie

No se si le he comprendido bien, así que resumo:
creo que su problema consiste en que en ie (¿qué versión?) no le muestra el fondo de .current-rating?

¿Cierto?
Si es así, pruebe a incluir las coordenadas /top:0; left:0/ para esa clase que la tiene con posición absoluta.

Si estuviese errado, ya nos comentaría.

Atentamente

Etiquetas: ratings, sitemap
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 12:29.