Comunidad de diseño web y desarrollo en internet online

Insertar imagenes en la barra de menu spryy cambiarles el tamaño

Citar            
MensajeEscrito el 28 Sep 2012 02:32 pm
Buenas mi problema es el siguiente estoy intentando cambiar los el fondo de los botones de la barra de menu spry por imagenes pero cuando las pongo se me vuelve transparente, el tamaño de las imagenes es de 350x140
con este le cambie el tamaño

Código CSS :

/* Menu item containers, position children relative to this container and are a fixed width */
ul.MenuBarHorizontal li
{
   margin: 0;
   padding: 1%;
   list-style-type: none;
   font-size: 100%;
   position: relative;
   text-align: center;
   cursor: pointer;
   width: 14%;
   float: left;
}
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
{
   margin: 0;
   padding: 0;
   list-style-type: none;
   font-size: 100%;
   z-index: 1020;
   cursor: default;
   width: 112%;
   position: absolute;
   left: -1000em;
}

este para los submenus dentro de submenus

Código CSS :

ul.MenuBarHorizontal ul li
{
   width: 112%;
}

en este inserto las imagenes y tambien cambio el tamaño

Código CSS :

/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
{
   display: block;
   cursor: pointer;
   padding: 0.5em 0.75em;
   color: #06F;
   background-image: url(Botones/Boton.png);
   width: 100%;
   height: 100%;
   text-decoration: none;
   background-color: #09F;
}
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
{
   background-color: #33C;
   color: #FFF;
}
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
{
   color: #09F;
   background-image: url(Botones/Boton_Hover.png);
   background-color: #09F;
}

lo que busco es que la imagen se adapte al tamaño de cada menu
gracias espero su respuesta

Por Mvkbeguelin

18 de clabLevel



 

firefox
Citar            
MensajeEscrito el 28 Sep 2012 02:39 pm
ah me olvide de aclarar la barra de menus spry esta en css3

Por Mvkbeguelin

18 de clabLevel



 

firefox
Citar            
MensajeEscrito el 29 Sep 2012 09:46 pm
al final lo termine solucionando borrando la barra de menus spry y haciendo otra en css con jquery ajustando los bordes y haciendo un degradado sin necesidad de cargar una imagen, yo pense que en este foro se podia consultar ese tipo de cosas, pero veo que me equivoque
saludos

Por Mvkbeguelin

18 de clabLevel



 

firefox
Citar            
MensajeEscrito el 13 Ago 2014 09:32 pm
Sera porque nadie sabe lo que hicistes por ejemplo yo quiero aprender lo que tu sabes, agradeceria mucho que me ayudases con este tema yo tbn quiero ingresar imagenes en ves de letras en una barra de menu SPRAY...... tyson77 :cool:

Por tyson77

0 de clabLevel



 

chrome

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.