Este fórum foi descontinuado. LEIA AQUI e participe da Comunidade BABOO :)

Ir para conteúdo
MR_Michael

Menu CSS com hover e active

Mensagem Recomendada

Boa tarde Pessoal estou aqui com mais uma duvida...rs

 

Fiz um menu html e css, usando hover e active para abrir o submenu, no PC bele coloco o ponteiro em cima abre o submenu, porem no celular quando cliko abre o submenu....mas aki vem a questão: ex: tenho no menu 5 links onde 3 tem submenus quando abro o primeiro submenu ele fica na tela normal mas quando cliko em outro link com submenu ele fecha o submenu anterior mas não abre o novo ai tenho q clicar novamente ai abre, mas testando percebi que se eu abrir os links do ultimo para o primeiro ele executa certinho fechando o anterior e abrindo o qual eu clikei, alguém sabe como resolver isso?

 

desde já agradeço a todos.

Fiquem com Deus.

 

PS: desculpe se não me expressei direito.


A Cada Dia, Um Novo Dia...A Cada Dia, Um Novo Desafio!!!

Compartilhar este post


Link para o post
Compartilhar em outros sites

use um css para identificar a plataforma... olha este artigo que coloquei

 

Design Responsivo é uma técnica de estruturação HTML e CSS, em que o site se adapta ao browser do usuário sem precisar definir diversas folhas de estilos para cada resolução.Em 2010, pensando em melhorar a sua experiência de navegação, Ethan Marcotte criou o artigo Responsive Web Design para o blog A List Apart. Ele apresenta o arquiteto inglês Christopher Wren, que disse certa vez que arquitetura é uma arte que “objetiva a eternidade”. Todo arquiteto que se preze quer construir um prédio que seja admirado (e habitado) por séculos… Infelizmente o Design Digital não tem a permanência da arquitetura. Na verdade, o que é projetado para internet hoje, já estará desatualizado daqui a duas semanas! Nos tempos atuais, além dos desktops e notebooks, é possível acessar a internet através de smartphones, tablets, televisores e já existem até mesmo geladeiras que possuem internet para algumas finalidades, como buscar receitas ou ler as últimas notícias, por exemplo.


  tt1.jpgFonte: Webop - http://webop.com.br/...movel-no-brasil

  De acordo com a pesquisa realizada pela WMcCann, 41% dos  entrevistados acessam a internet pelo celular e, dentre estes, 47%  utilizam banda larga móvel (3G). Além disso, 44,4% das pessoas que ainda  possuíam o celular convencional, disseram que pretendiam trocar de  aparelho em 6 meses ou menos.
 

“A tendência, este ano, é aumentar ainda mais. As  pessoas preferem ter um celular conectado à internet, para acessar de  qualquer lugar”
, disse o ministro das Comunicações, Paulo Bernardo,  ao participar do programa Bom Dia, Ministro, produzido pela EBC  Serviços em parceria com a Secretaria de Comunicação da Presidência.
“Temos,  agora, de ter mecanismos para treinar e orientar as pessoas a entrar  nesses ambientes digitais com muita velocidade. E também baratear planos  e smartphones”
, completou.


Frequentemente estão surgindo novas maneiras de acessarmos a  internet, então é preciso conseguir uma estrutura de codificação HTML e  CSS que independa do meio utilizado pelo usuário para acessá-la. Afinal,  você pode até querer eleger uma categoria como alvo principal:  desktops, por exemplo, mas ainda vai haver as diferenças entre sistemas  operacionais, browsers, resoluções de tela…


Exemplos:
ran.smartphone.thumb.pngran.tablet.thumb.pngran.netbook.thumb.png
Rachel Nabors

sub.smartphone.thumb.pngsub.tablet.thumb.pngsub.netbook.thumb.png
StartUP Britain

yam.smartphone.thumb.pngyam.tablet.thumb.pngyam.netbook.thumb.png
YAML CSS Framework


Os desenvolvedores, em sua grande maioria, trabalham com os  960 pixels como base para todo site, e dentro desse espaço se cria todo o  site. Na época onde os monitores tinham uma resolução de tela de  1024x768, utilizar 960px era a décima primeira maravilha do mundo. A  evolução veio e junto com ela os dispositivos móveis.  Hoje em dia se vende mais smartphone do que computadores,  e isso é um fato que precisamos encarar. Outro detalhe, nem tão detalhe  assim, é que desenvolver um site para cada tamanho de dispositivo, é  loucura. Imagine que todo dia uma empresa fabrica uma tablet com uma nova  resolução de tela, para uma marca X e disponibiliza ele no mercado. Pronto, lá vai você correndo escrever código para um novo tamanho de tela.


Não é preciso desenvolver um template, escrever um código novo para tamanho de tela que existe no mercado. O Design Responsivo usa Media Queries, que em uma tradução livre é  consulta de mídia. São expressões que direcionam o visitante do seu site  para uma folha de estilos diferente de acordo com o dispositivo que ele  estiver utilizando.

/* Smartphone em modo retrato */ @media only screen and (max-width : 320px) { /* estilos */ }   /* iPads (retrato e paisagem) */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) { /* estilos */ }



Aqui outro exemplo mais completo.  

/* Smartphones (retrato e paisagem) ----------- */ @media only screen and (min-device-width : 320px)  and (max-device-width : 480px) { /* Styles */ }   /* Smartphones (retrato) ----------- */ @media only screen and (max-width : 320px) { /* Styles */ }   /* iPad (retrato e paisagem) ----------- */ @media only screen and (min-device-width : 768px)  and (max-device-width : 1024px) { /* Styles */ }   /* iPad (paisagem) ----------- */ @media only screen and (min-device-width : 768px)  and (max-device-width : 1024px)  and (orientation : landscape) { /* Styles */ }   /* iPad (retrato) ----------- */ @media only screen and (min-device-width : 768px)  and (max-device-width : 1024px)  and (orientation : portrait) { /* Styles */ }   /* Desktops e laptops ----------- */ @media only screen and (min-width : 1224px) { /* Styles */ }   /* Telas grandes ----------- */ @media only screen and (min-width : 1824px) { /* Styles */ }   /* iPhone 4 ----------- */ @media only screen and (-webkit-min-device-pixel-ratio : 1.5), only screen and (min-device-pixel-ratio : 1.5) { /* Styles */ }


<%X@nBuRzUm%>

=========================

* nós somos consequência do que pensamos *

** mensagem 100% de Eletrôns recicláveis **

*** Transformando pensamentos em bits ***

Compartilhar este post


Link para o post
Compartilhar em outros sites

хотят играть казино должны веб-казино

[url=https://www.gclub88.com/][color=#FFFFFF]gclub online[/color][/url]

Compartilhar este post


Link para o post
Compartilhar em outros sites

×
×
  • Criar Novo...