Description:
<div id="parent"> <div id="child"></div> <div id="child2"></div> </div>
#child has a background image. #parent is then hidden by
$('#parent').hide()and then #child is hidden by
$('#child').hide()When you open #parent again, you still see the background image of #child even though it's already hidden with style="display: none;". When you mouse over it, the background image would disappear.
Solution:
Hide elements in order of inner element to outer element. i.e.,
$('#child').hide()then
$('#parent').hide()
I spent almost 2 hours debugging this. Hope this post can save you some times.