¡Advertencia!
Este tema no ha tenido respuestas en más de un mes. Recuerda que si deseas añadir una nueva debes cumplir con las normas de la web.
la cosa es que el menú que tengo hecho yo es diferente al del ejemplo de la web y no me sale :S
Este es el index con el menú, he sustituido los links de la página por "URL" para que no veáis xD
Y este es el css
A ver si alguien es capaz de ayudarme para crear el menú desplegable Estoy en skype todo el rato si me podéis ayudar o si colocáis aquí como hacerlo perfecto
Este es el index con el menú, he sustituido los links de la página por "URL" para que no veáis xD
<div class="navigation">
<a href="index.php"><div class="navigation_button">Inicio<></a>
<a target="contenido" href=""URL""><div class="navigation_button">Artículos<></a>
<a target="contenido" href=""URL""><div class="navigation_button">Mercado<></a>
<a target="contenido" href="URL""><div class="navigation_button">Selecciones<></a>
<a target="contenido" href=""URL""><div class="navigation_button">Reportajes<></a>
<a target="contenido" href="/"URL""><div class="navigation_button">+ Deportes<></a>
<a target="contenido" href=""URL""><div class="navigation_button">Especiales<></a>
<a target="_blank" href=""URL"">
<div class="navigation_button">Foro<></a>
<>Y este es el css
.navigation {
margin: 0 auto;
width: 998px;
height: 35px;
background: url(../images/navigation.png) no-repeat;
}.navigation_button {
border-right: 1px solid #1B4C59;
color: #FFF;
float: left;
height: 34px;
font: bold 12px/35px Verdana,Geneva,sans-serif;
max-width: 200px;
padding: 0 8px;
text-shadow: 1px 1px 1px black;
margin: 0px 1px 0px 0px;
}
.navigation_button:hover {
background: #337aa3;
border-right: 1px solid #1B4C59;
color: #FFF;
float: left;
height: 34px;
font: bold 12px/35px Verdana,Geneva,sans-serif;
max-width: 200px;
padding: 0 8px;
text-shadow: 1px 1px 1px black;
margin: 0px 1px 0px 0px;
}A ver si alguien es capaz de ayudarme para crear el menú desplegable Estoy en skype todo el rato si me podéis ayudar o si colocáis aquí como hacerlo perfecto
Necesito un codigo de javascript que al mover el "slide" te cambie el border radius de un div. Please.
la cosa es que el menú que tengo hecho yo es diferente al del ejemplo de la web y no me sale :S
Este es el index con el menú, he sustituido los links de la página por "URL" para que no veáis xD<div class="navigation"> <a href="index.php"><div class="navigation_button">Inicio<></a> <a target="contenido" href=""URL""><div class="navigation_button">Artículos<></a> <a target="contenido" href=""URL""><div class="navigation_button">Mercado<></a> <a target="contenido" href="URL""><div class="navigation_button">Selecciones<></a> <a target="contenido" href=""URL""><div class="navigation_button">Reportajes<></a> <a target="contenido" href="/"URL""><div class="navigation_button">+ Deportes<></a> <a target="contenido" href=""URL""><div class="navigation_button">Especiales<></a> <a target="_blank" href=""URL""> <div class="navigation_button">Foro<></a> <>
Y este es el css.navigation { margin: 0 auto; width: 998px; height: 35px; background: url(../images/navigation.png) no-repeat; }.navigation_button { border-right: 1px solid #1B4C59; color: #FFF; float: left; height: 34px; font: bold 12px/35px Verdana,Geneva,sans-serif; max-width: 200px; padding: 0 8px; text-shadow: 1px 1px 1px black; margin: 0px 1px 0px 0px; } .navigation_button:hover { background: #337aa3; border-right: 1px solid #1B4C59; color: #FFF; float: left; height: 34px; font: bold 12px/35px Verdana,Geneva,sans-serif; max-width: 200px; padding: 0 8px; text-shadow: 1px 1px 1px black; margin: 0px 1px 0px 0px; }
A ver si alguien es capaz de ayudarme para crear el menú desplegable Estoy en skype todo el rato si me podéis ayudar o si colocáis aquí como hacerlo perfecto
Tendrías que encerrar los links en una lista desordenada y luego asignarles sus respectivos estilos en el css, te voy a poner un ejemplo:
<div class="navigation">
[b]<ul>
[/b][b]<li>[/b]<a href="index.php"><div class="navigation_button">Inicio<></a>[b]</li>[/b]
<a target="contenido" href=""URL""><div class="navigation_button">Artículos<></a>
<a target="contenido" href=""URL""><div class="navigation_button">Mercado<></a>
<a target="contenido" href="URL""><div class="navigation_button">Selecciones<></a>
<a target="contenido" href=""URL""><div class="navigation_button">Reportajes<></a>
<a target="contenido" href="/"URL""><div class="navigation_button">+ Deportes<></a>
<a target="contenido" href=""URL""><div class="navigation_button">Especiales<></a>
<a target="_blank" href=""URL"">
[b]</ul>
[/b]<div class="navigation_button">Foro<></a>
y el css:
.navigation li {
float: left;
font-size: 20px;
font-weight: bold;
line-height: 80px;
list-style-type: none;
padding-right: 50px;
text-transform: uppercase;
}
.navigation {
background: url("img/bgmenu.png") repeat-x scroll 0% 0% transparent;
height: 70px;
width: 100%;
}
.navigation li a {
color: #222222;
position: relative;
text-decoration: none;
}
.navigation li a:hover {
color: #000000;
}
.navigation ul li ul span {
background: url("img/flecha.png") repeat scroll 0% 0% transparent;
height: 10px;
margin: -20px 50px;
position: absolute;
width: 20px;
}
.navigation ul li ul {
background: none repeat scroll 0% 0% #CAC99E;
display: none;
margin: -12px -20px;
padding: 10px 0pt;
position: absolute;
}
.navigation ul li:hover ul {
display: block;
}
.navigation ul li ul li {
color: #FFFFFF;
display: block;
float: none;
line-height: 30px;
padding: 0pt 20px;
position: relative;
}
.navigation ul li ul li a {
color: #444444;
}
.navigation ul li ul li a:hover {
color: #000000;
}
Está basado en el ejemplo que te pasó Ivan y es más o menos para orientarte. En negrita te marqué las etiquetas que te faltaban del html. Cualquier duda, preguntá
jeje
Necesito un codigo de javascript que al mover el "slide" te cambie el border radius de un div. Please.
document.getElementById("idDiv").style.borderRadius="15px";
Como hago para que cuando en un logo pase el cursor por encima, se mueva como una especie de zumbido, algún código que me sirva?
Fratello di solitudine, qui oggi siamo entrambi.
Como hago para que cuando en un logo pase el cursor por encima, se mueva como una especie de zumbido, algún código que me sirva?
Sé que este mensaje es muy antiguo, pero por si alguien tiene la misma duda aquí dejo la respuesta.
.animated {
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
@-webkit-keyframes zumbido {
0% {-webkit-transform: scale(1);}
10%, 20% {-webkit-transform: scale(0.9) rotate(-3deg);}
30%, 50%, 70%, 90% {-webkit-transform: scale(1.1) rotate(3deg);}
40%, 60%, 80% {-webkit-transform: scale(1.1) rotate(-3deg);}
100% {-webkit-transform: scale(1) rotate(0);}
}
@keyframes zumbido {
0% {transform: scale(1);}
10%, 20% {transform: scale(0.9) rotate(-3deg);}
30%, 50%, 70%, 90% {transform: scale(1.1) rotate(3deg);}
40%, 60%, 80% {transform: scale(1.1) rotate(-3deg);}
100% {transform: scale(1) rotate(0);}
}
.zumbido:hover {
-webkit-animation-name: tada;
animation-name: tada;
}
Solo agrega las clases animated y zumbido a tu elemento y cuando esté en estado hover lanzará la animación.
Políticamente irresistible.