show div on hover
-
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 workI tried to explain as clearly as possible, if not please say so.
Thanks! -
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-meanThats 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"
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it