Foros del Web » Creando para Internet » CSS »

a:active no funciona

Estas en el tema de a:active no funciona en el foro de CSS en Foros del Web. Buenas tardes a todos, Estoy creando un menú con este estilo: Código PHP: < style type = "text/css" > a . item_menu  {      float :  ...
  #1 (permalink)  
Antiguo 17/01/2011, 10:00
 
Fecha de Ingreso: octubre-2007
Mensajes: 130
Antigüedad: 10 años, 1 mes
Puntos: 2
a:active no funciona

Buenas tardes a todos,

Estoy creando un menú con este estilo:

Código PHP:
<style type="text/css">
a.item_menu {
    
floatleft;
    
widthauto;
    
margin-left20px;
    
height30px;
    
padding-top20px;
    
padding-left10px;
    
padding-right10px;
}

a.item_menu:hover {
    
padding-top15px;
    
padding-bottom4px;
    
border-top-widthmedium;
    
border-right-widthmedium;
    
border-bottom-widthmedium;
    
border-left-widthmedium;
    
border-top-stylesolid;
    
border-right-stylenone;
    
border-bottom-stylesolid;
    
border-left-stylenone;
    
border-top-color#FFF;
    
border-right-color#FFF;
    
border-bottom-color#FFF;
    
border-left-color#FFF;
}
a.item_menu:active {
    
padding-top15px;
    
padding-bottom4px;
    
border-top-widthmedium;
    
border-right-widthmedium;
    
border-bottom-widthmedium;
    
border-left-widthmedium;
    
border-top-stylesolid;
    
border-right-stylenone;
    
border-bottom-stylesolid;
    
border-left-stylenone;
    
border-top-color#FFF;
    
border-right-color#FFF;
    
border-bottom-color#FFF;
    
border-left-color#FFF;
}

-->
</
style
y este es el menú:
Código PHP:
<div id="menu">
            <
a href="index.php" class="item_menu" >
                <
span class="texto_blanco">INICIO</span>
           </
a>
           <
a href="#" class="item_menu" ><span class="texto_blanco">LA SASTRERIA</span>
           </
a>
           <
a href="#" class="item_menu" >
                <
span class="texto_blanco">GALERIA FOTOGRAFICA</span>
           </
a>
           <
a href="#" class="item_menu" >
                <
span class="texto_blanco">NOTICIAS</span>
           </
a>
           <
a href="#" class="item_menu" >
                <
span class="texto_blanco">CATALOGO</span>
           </
a>
           <
a href="#" class="item_menu" >
                <
span class="texto_blanco">CONTACTO</span>
           </
a>
        </
div
pero cuando pulso sobre el index el estilo active no aparece, quiero que cuando esté en el index se cargue un estilo predeterminado. Alguien sabe porqué no funciona? gracias.
  #2 (permalink)  
Antiguo 17/01/2011, 10:32
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 9 años, 4 meses
Puntos: 1530
Respuesta: a:active no funciona

la regla css es clara: a.item_menu:active elemento a de la clase item_menu, sin ningún span :
Código HTML:
Ver original
  1. <a href="index.php" class="item_menu" >
  2.                 <span class="texto_blanco">INICIO</span>
  3.            </a>
puedes especificar otra regla más global como:

Código CSS:
Ver original
  1. a .item_menu:active {
  2. /* todo elemento clase item_menu dentro de a*/
  3. }
  4. a.item_menu:active,
  5. a span.item_menu:active
  6. {
  7.  
  8. }
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...
  #3 (permalink)  
Antiguo 17/01/2011, 11:43
 
Fecha de Ingreso: noviembre-2009
Ubicación: Colombía
Mensajes: 311
Antigüedad: 8 años
Puntos: 17
Respuesta: a:active no funciona

Una forma más para hacerlo:

Cita:
<div id="menu">
<a href="index.php" class="item_menu active" >
<span class="texto_blanco">INICIO</span>
</a>
<a href="#" class="item_menu" ><span class="texto_blanco">LA SASTRERIA</span>
</a>
<a href="#" class="item_menu" >
<span class="texto_blanco">GALERIA FOTOGRAFICA</span>
</a>
<a href="#" class="item_menu" >
<span class="texto_blanco">NOTICIAS</span>
</a>
<a href="#" class="item_menu" >
<span class="texto_blanco">CATALOGO</span>
</a>
<a href="#" class="item_menu" >
<span class="texto_blanco">CONTACTO</span>
</a>
</div>
CSS:

Cita:
a.item_menu .active {
padding-top:15px 0 4px 0;
border-top:medium solid #fff;
border-bottom:medium solid #fff;
border-right:0;
border-left:0;
}
Hay tienes, pero también te mejoro todo el CSS:

Cita:
a.item_menu {
float:left;
width:auto;
margin-left:20px;
height:30px;
padding-top: 20px 10px 0 10px;
}

a.item_menu:hover {
padding-top:15px 0 4px 0;
border-top:medium solid #000;
border-bottom:medium solid #000;
border-right:0;
border-left:0;
}
a.item_menu:active {
padding-top:15px 0 4px 0;
border-top:medium solid #000;
border-bottom:medium solid #000;
border-right:0;
border-left:0;
}
Saludos!
  #4 (permalink)  
Antiguo 18/01/2011, 03:08
 
Fecha de Ingreso: octubre-2007
Mensajes: 130
Antigüedad: 10 años, 1 mes
Puntos: 2
Respuesta: a:active no funciona

Gracias a los dos por vuestras respuestas!

pero sigo sin ver lo que yo quiero hacer, quizás no me he explicado bien.

Quisiera mantener el estilo de los dos bordes superior e inferior si se ha pulsado sobre inicio y estas en index.php. De esta forma solo aparece el borde superior e inferior cuando se pasa por encima el ratón.

Gracias otra vez!!
  #5 (permalink)  
Antiguo 18/01/2011, 05:56
Avatar de sanxuan  
Fecha de Ingreso: enero-2011
Ubicación: Gijón
Mensajes: 671
Antigüedad: 6 años, 11 meses
Puntos: 36
Respuesta: a:active no funciona

Si no te basta con a:visited que define la apariencia de un enlace ya visitado anteriormente, sólo te queda la posibilidad de usar programación, por ejemplo en JavaScript.
CSS no es un lenguaje de programación.
  #6 (permalink)  
Antiguo 18/01/2011, 06:06
 
Fecha de Ingreso: octubre-2007
Mensajes: 130
Antigüedad: 10 años, 1 mes
Puntos: 2
Respuesta: a:active no funciona

Si ya he visto que estaba equivocada con la funcionalidad de a:active.

Lo he solucionado usando un estilo especifico para el enlace activo.

Gracias a todos por vuestras aclaraciones.

Etiquetas: Ninguno
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

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 17:27.