E possível somente com CSS fazer trocar a direção da flecha do menu quando abrir o submenu?
Acredito que a pergunta seria como detectar o click no menu.
Estou usando o toggleClass()
do jquery para fazer isso, mas gostaria de usar só CSS.
Stack Overflow em Português é um site de perguntas e respostas para programadores profissionais e entusiastas. Leva apenas um minuto para se inscrever.
Inscreva-se para participar desta comunidadeVocê pode fazer isso adicionando o atributo tabindex
à div
e alterando a imagem da flecha (considerando que a imagem seja um background
) quando a div
receber focus
:
div{
display: block;
width: 100px;
border: 1px solid #ddd;
padding: 10px;
background: url(https://www.uni.edu/unicalendar/profiles/uni_default_install/modules/custom/uni_blocks_antares/images/down_arrow.png) no-repeat 90%;
background-size: 20px;
}
div:focus {
background: url(https://www.ukcommunityfoundations.org/wp-content/themes/ukcf/images/layout/up-arrow.png) no-repeat 90%;
}
<div tabindex="1">
Menu
</div>