I'v been stuck on this for ages.

$(".poster-wrapper.tint").hover(function () { $(this).siblings(".controls").slideDown('fast'); }, function (e) { //Here is where I need if statement. Only slide up if the poster **and** the controls class is not being hovered on $(this).siblings(".controls").slideUp('fast'); });

.controls is ontop of the .poster-wrapper, so when I hover over poster wrapper it shows the controls class correctly, but when I hover over controls class they slide away again obviously because the poster is no longer being hovered on. How do I stop this unwanted behavior?

Jsfiddle: https://jsfiddle.net/9dzfys87/

I can't use pointer events: none.