[UrimTumim]

Mirki pomocy!
Jak zrobić rozwijane menu(ale nie po kliknięciu, tylko po najechaniu), ale tylko przy użyciu javascript?
Mam jakąś tam strukturę html(potworną..), równie straszną css i co najgorsze -nie mogę w nie ingerować.
Jedyną opcją jest podpięcie do tego JS'a i bazując na tym co mam, zrobienie hover dropdown menu.
Mój problem - jak zrobić tak, żeby opuszczając np. Kategorię 3, dało się zjechać na Podkategorie?;x Zanim najadę na podkategorię, opuszczam kategorię (mouseout) i się zamyka. I nie wiem jak to ugryźć;x
Próbowałem różnych rzeczy od jakiś buforów zapamiętujących stan począwszy, z próbami opóźnienia zamknięcia ale nic mi nie działa;x
Wrzuciłem przykład "szybko zamykający się"

fiddle

ps. wiem, że da się to zrobić tylko i wyłącznie za pomocą samych css..i że wtedy zajmuje to 3 min..
ps2. uprzedzając uwagi, wiem też że powinno się używać id jako unikalnego identyfikatora, własne atrybuty powinno się deklarować przez przedrostek data- i że jest tam tysiąc innych błędów :(

#webdev #javascript #js #frontend

[Johnny_]

@UrimTumim tak poza tematem, za pomoca js możesz edytować HTML i stylowac elementy więc oprócz tego że będzie to syfiaste rozwiązanie to nie masz żadnych ograniczeń

[UrimTumim]

@Johnny_: hm, syfiaste to mało powiedziane;x
a nie wiesz może jak to zrobić za pomocą addEventListener'ów? Bo to co wrzuciłem to jest mikro wycinek większej całości i jakbym miał to przebudowywać i składać od zera to chyba zabraknie mi życia ;(

[Johnny_]

@UrimTumim sorry jestem w pracy mam co robić :p

[LostHighway]

@UrimTumim: A nie możesz zrobić tego w css i dolinkować za pomocą js? Przecież i tak obstylować to musisz.

[m.....t]

o matko, niezły potworek. Ale rozwiązanie jest stosunkowo proste - niech te elementy z listą sub menu będą childem tego elementu na którym triggerujesz hover.

[UrimTumim]

@mortt: hm, nie do końca rozumiem, mógłbyś ciut rozwinąć albo dodać do fiddla? ;x

[m.....t]

@UrimTumim: jeśli masz element DOM, do którego dopiąłeś wydarzenie, które to wydarzenie nasł#!$%@? pozycji kursora. I teraz umieścisz następny element wewnątrz tego elementu DOM - wywołanie będzie działać za równo dla głównego elementu jak i elementu-dziecka (poziom niżej). W związku z powyższym element nie przestanie znikać.

[UrimTumim]

@mortt: dzięki za pomoc i poświęcony czas ale nadal nie ogarniam :(
mam wrzucić span o np. id=uzytk do span m=3? ;x
Za pomocą .appendChild?;x

[m.....t]

@UrimTumim:


eventListener ustawiony na parent będzie się utrzymywał również na child ponieważ child zawiera się w parent'cie. Jeśli tego nie ogarniasz to nie wiem jak Ci pomóc. Nie mam czasu zrobić Ci z tego fiddle'a. Skoro parent.eventListener utrzymuje wyświetlenie child. To w pomomencie przejścia hover na child parent wciąż jest aktywny bo niejako okala child.

[MrRuby]

https://codyhouse.co/gem/stripe-navigation/

[getin]

takie rozwiązanie masz w prawie każdym frameworku css...

[UrimTumim]

@mortt: Ogarnąłem, dzięki wielkie za pomoc! :)
ps. reszcie też dziękuję :D