show div on hover

vraagje

Hi he hello

I want to make a Div from the custom css/html sections to be shown when hovering over a div inside a page.
I made a little jsfiddle to explain/show what i mean and want.

When implementing the code inside laytheme, It only works half.
#a:hover {... works fine
#a:hover + #b {... doesn't work

I tried to explain as clearly as possible, if not please say so.
Thanks!

arminunruh

hello vraagje!

here i read that the "+" css operator only applies to an element if it is an adjacent element (next to the other one)
http://stackoverflow.com/questions/1139763/what-does-the-plus-sign-css-selector-mean

Thats why it doesn't work on your website, because the elements are not adjacent. However, you can achieve this mouseover interaction with js.
In "custom html& css" -> "custom <head> content":

<script>
jQuery(document).on("mouseenter", ".hoverme", function(event) {
	jQuery(".showme").show();
});
jQuery(document).on("mouseleave", ".hoverme", function(event) {
	jQuery(".showme").hide();
});
</script>

In the above example i didnt use your id's but used some classes "showme" and "hoverme"

Lay Theme Forum

show div on hover

Online Users