Wywoływanie: hover pseudo-class poprzez przeniesienie zdarzeń za pomocą JavaScript
Oto scenariusz:
Masz dwa obrazy i są one ułożone jeden na drugim. Obraz najwyższego rzędu zindeksowany jest odpowiedzialny za obsługę zdarzeń kliknięć (pomyśl o Google API Map) i jest przezroczysty, a poniższy obraz odpowiada za wizualną reprezentację.
Oto reprezentacja pseudo-HTML / CSS:
div.visual-container {
width: 10px;
height: 10px;
}
div.visual-container:hover {
background-color: #555;
}
div.click-container {
width: 10px;
height: 10px;
}
<div class='lowest'>
<div class='visual-container'></div>
</div>
<div class='highest'>
<div class='click-container'></div>
</div>
Teraz, gdy kliknięty zostanie element „najwyższy”, zdarzenie jest wywoływane również na elemencie „najniższym”.
Podstawowa idea:
function onHoverEventForHighest() {
createMouseEvent(lowest_element, 'mouseover', event);
};
Ta część jest w porządku i odpowiednio przenosi zdarzenie,ale to nie wydaje się wywoływać klasy: hover CSS psuedo.
Czy ktoś miał szczęście z robieniem czegoś takiego?