Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Boa tarde pessoal, estou estudando como e sempre e vi esse site >> http://www.formate.com.br/
Em especifico gostei do menu. Dei uma olhadinha no código mas não entendi 100% como fazer um
menu semelhante a este.
<li> = background em left com a borda
<a> = repeat-x
<span> = fim do corner
Alguém aqui ja fez/faz um menu assim ?
Aguardo resposta,
Até mais pessoal
sim repaei nisso, mas como ele troca o bg do span O_o. Ele usou o jquery pra isso ?
Eu já te dei o link que tem o código pronto, basta estuda-lo! ^_^
Para trocar o background nós usamos a técnica do CSS Sprite, ou seja, a imagem é trocada pelo background-position.
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Opa thiago, obrigado. O linkq ue voce enviou tava diferente xD.
Comecei a navegar nos desafios ai até me perdi, alias, o conteúdo ta legal.
O Terceiro Menu? eu não usei nenhum 'span'. Fiz apenas com 2 elementos LI e A
não usei jQuery não.
Troca do canto direito:
#menu li a:hover {
background: url('cantos.png') no-repeat right top; troca do canto esquerdo:
#menu li:hover,
#menu li.over {
background: url('bgLIs.png') left top; a classe, é para o JS que faz o IE reconhecer :hover
Veja a segunda solução:
cara isso é o normal dos menus, ou melhor dizendo a forma correta quando não se precisa de Image Replacement
Repare que no li ele coloca o corner do lado esquerdo
ai no meio uma imagem com background em degrade
e por fim ele foi obrigado a adicionar um span para fazer o corner do lado direito
entendeu agora?
qual sua dúvida em especifico?
abraço