Foros del Web » Programando para Internet » Jquery »

Problema con jquery y CSS

Estas en el tema de Problema con jquery y CSS en el foro de Jquery en Foros del Web. Buenas, tengo un problema y puede parecer muy tonto pero el caso es que no tengo mucha idea por no decir casi nada de css ...
  #1 (permalink)  
Antiguo 10/07/2012, 05:46
Avatar de Wertas  
Fecha de Ingreso: julio-2012
Mensajes: 5
Antigüedad: 11 años, 9 meses
Puntos: 2
Problema con jquery y CSS

Buenas, tengo un problema y puede parecer muy tonto pero el caso es que no tengo mucha idea por no decir casi nada de css con jquery, bueno al lío, el caso es que quiero hacer un menú de este estilo [url]http://demo.marcofolio.net/keypress_navigation/[/url] pero no consigo que el estilo se quede en la letra o el ítem que yo selecciono, que por cierto el seleccionar el menuítem me va fino pero sin resaltarlo con ningún color pues como que no queda muy práctico que digamos.

Ahora la práctica:

- CSS, siendo .quicksearchstyle la clase de una capa:
Código:
.quicksearchstyle{
    position:absolute;
    top:80px;
    width:325px;
    display: block;
    padding-left: 0px;
    float:left;
    text-align:left;
    border: 1px solid #ccbf53;
    background-color:#FFF5EE;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 11px;
    line-height: 175%;
    z-index: 1000;
    -moz-opacity: 0.85;
    filter:alpha(opacity=90);  
    -moz-opacity: 0.9;  
    -khtml-opacity: 0.9;  
    opacity: 0.9; 
}

.quicksearchstyle a{
    background-color: #fff;
    display: block;
    filter: alpha(opacity=100);
    -moz-opacity:1;
    -khtml-opacity: 1;
    opacity: 1;
}

/*
Así es como estaba originalmente esta parte de estilo:
.quicksearchstyle a:hover{
    color: white;
    background-color: #990000;
    text-decoration: none;
}
*/
/*
Ahora mi movida
.asdf{
    color: white;
    background-color: #990000;
    text-decoration: none;
}
*/
A {color: #000; text-decoration: none;}
A:hover {color: #994900; text-decoration: underline;}
- jquery:
Código:
...
blabla coger evento de teclado blablabla
...

$("#quicksearch span a").removeClass("asdf");
$("#quicksearch span a").eq(menuitem).addClass("asdf");

...

Lo que veo es que el :hover da problemas en cuanto a que es un estilo predefinido sin clase alguna, de alguna manera habría que fijar esa clase para que fuese reemplazable pero entonces afecta a varias partes de la web y cuantas menos cosas se toquen mejor (pero bueno si hay que hacerlo se hace).

Un saludo!
  #2 (permalink)  
Antiguo 11/07/2012, 03:43
Avatar de Wertas  
Fecha de Ingreso: julio-2012
Mensajes: 5
Antigüedad: 11 años, 9 meses
Puntos: 2
Respuesta: Problema con jquery y CSS

Código:
#quicksearch ul{
	position:absolute;
	top:69px;
	width:325px;
	display: block;
	padding-left: 0px;
	margin-left: 137px;
	float:left;
	text-align:left;
	border: 1px solid #ccbf53;
	background-color:#FFF5EE;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 175%;
	z-index: 1000;
	-moz-opacity: 0.85;
	filter:alpha(opacity=90);  
	-moz-opacity: 0.9;  
	-khtml-opacity: 0.9;  
	opacity: 0.9;
	
	list-style:none !important;
}

#quicksearch ul li a{
	background-color: #fff;
	display: block;
	filter: alpha(opacity=100);
	-moz-opacity:1;
	-khtml-opacity: 1;
	opacity: 1;
}

#quicksearch ul li a:hover{
	color: white;
	background-color: #990000;
	text-decoration: none;
}

.asdf{
	color: 				white 	!important;
	background-color: 	#990000 !important;
	text-decoration: 	none;
}

He buscado que con poner !important se evita la herencia en cascada de css porque parece ser que el problema es ese pero aun así no consigo fijar la clase "asdf" en el hipervínculo. Alguna sugerencia?


PD.: como podeis observar he cambiado de clase a identificador pero esto no altera nada el código anterior al igual que el span por la lista desordenada.

Etiquetas: css, html
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:15.