[le1t00]

Cześć, szukam info jak zrobić taki efekt:
mam siatkę, 8x8.
Jak najadę kursorem na element to przyległe divy otrzymują jakąś klasę.
Rozwiązanie które wpadło mi do głowy jest tak skomplikowane, że raczej to nie tak.
Wydaje mi się, że gdzieś coś takiego widziałem. Od tego zależy cała struktura. Obecnie mam kolumny 1x8, ale tak to raczej nie zadziała.
#webdev #javascript #jquery #js #css

[K.....a]

@le1t00: jQuery + wykorzystanie hover ? Strasznie toporne, ale na początek przejdzie ( ͡° ͜ʖ ͡°)

[krab58]

@le1t00: może po prostu z palca ponumerować każdy element siatki i jak najedziesz na 5 to 2, 4, 6, 8 dodajesz nową klasę?

[le1t00]

@krab58: przy 80+ elementach robi się z tego syf, a nie kod. A taki też pomysł miałem.

[krab58]

@le1t00 myślałem ze masz tylko 8, tak to masz 100% rację

[epi]

@le1t00: po najechaniu danego diva pobierasz sobie jakoś jego numer w kolejności
nastepnie robisz sobie tablice numerków do zaznaczenia:
[numer-1, numer,+1, numer-bok, numer+b]
i dla kazdego elementu odpowiadajacemu numerkom z tablicy dodaje klase

oczywiście przydałoby sie obsłużyć elementy brzegowe ;)

[epi]

@le1t00: https://jsfiddle.net/hw5qeguy/
proste rozwiązanie na szybko
elementy brzegowe musisz już sobie sam obsłużyć ;)

[Melcma]

@le1t00: ja bym sprobowal tak, ze na hoverze selektuje nth:child (this-1) i (this+1) cos w tym stylu

[ves666]

Tak jako ciekawostkę, zero JSa:

https://jsfiddle.net/qsnhgkq9/embedded/result/

[epi]

@ves666: ciekawe podejście ;)

@le1t00: https://jsfiddle.net/hw5qeguy/1/
wciągnąłem sie i zrobiłem trochę poprawek + elementy brzegowe :)

[ves666]

@epi: Ja podobnie! Dodałem JSa który generuje HTMLa i zmieniłem CSS na SCSS, tak żeby łatwo było zmieniać wielkość kwadratów.

https://jsfiddle.net/qsnhgkq9/1/

[le1t00]

@epi: Co dziwne, gdy zaaplikowałem to do istniejącego kodu to np. brzegowy element z prawej strony dodaje selected do kolejnego elementu.
Z lewej strony działa git.
A twojego kodu pozbyłem się generowania boxów bo mam je w htmlu.

[le1t00]

@epi: i przedostatni element na hover nie dodaje z prawej selected. Dziwna sprawka

[epi]

@le1t00: coś zepsułeś pewnie ;)