How to force two elements become hovered at the same time being both different?
For example:
<div id="dad">
<div id="bro"></div>
<div id="sis"></div>
</div>
#bro:hover {
background: url(imgBRO.jpg);
}
#sis:hover {
background: url(imgSIS.jpg);
}
If I put mouse over #bro, the #sis:hover is active and both images appears on each element . Same if mouse is over #sis .
Someone can help me? The solution can be CSS or JS, please.