Change menu direction when opening submenu

0

Is it possible only with CSS to change the direction of the menu arrow when opening the submenu?

I think the question would be how to detect click from the menu.

I'm using toggleClass() of jquery to do this, but I'd like to use CSS only.

    
asked by anonymous 22.10.2017 / 19:40

1 answer

1

You can do this by adding the tabindex attribute to div and changing the arrow image (assuming the image to be background ) when div receives 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>
    
22.10.2017 / 20:07