Hover na 2 elementach


(Kamil Kubik) #1

Witam,

wlasnie jestem w trakcie tworzenia strony i wpadlem na portal:

jest tam pokazany fajny element wizualny - jak najezdzaamy na jedna kropke, inne opcje sie podswietlaja w tym samym czasie... Sciagnalem kod zrodlowy css i html i troche pogrzebalem... Z Fade in/out nie ma problemu... Problem jest jednak w tym, ze opcje nie dzialaja w tym samym czasie, nie wiem jak to zrobic, by 2 animacje polaczyc razem w sposob interaktywny. Mysle ze trzeba by ty cos w rodzaju jquery, ale nie znam sie za bardzo na tym :frowning: Czy istnieje zatem jakis inny sposob zeby zrobic hover 2 elementow w tym samym czasie tylko w css?


(kostek135) #2

To nie jest hover dwóch elementów. Hover jest dość ograniczony ponieważ umożliwia zmiany tylko elementu w kontekście który został "najechany" kursorem. Można to zrobić przy użyciu java scriptu. Generalnie pewno dlatego nie udało ci się sprawić wrażenia równoległości, ze miałeś jeden wątek, który musiał najpierw skończyć jedną animację, aby przejść do drugiej. Poczytaj: http://blog.kamilbrenk.pl/web-workers-w ... avascript/ lub pogooglaj za podobnymi.

Ewentualnie da się to zrobić w jednym wątku, przykład: 2 okienka obniżające się całkowicie o 500px w dół, a co obrót pętli zjeżdżają o zadana wartość x na zasadzie: obniż pierwsze o x, obniż drugie o x, dozór, obniż pierwsze o x, obniż drugie o x, dozór... Nie mniej jest to moim zdaniem mało eleganckie, ponieważ tworzysz funkcję robiącą 2 rzeczy zamiast robiącą jedną i wywołując ją dwa razy. Aczkolwiek ja osobiscie nie podejmowałbym się zrobienia czegoś bardziej skomplikowanego w ten sposób, gdyż zgranie tego może być dość męczące.


(Kamil Kubik) #3

Dzieki za odpowiedz kostek, znalazlem rowniez inny spob w jquery:

nie wiem jednak jak to ogarnac, aby ten kod byl aplikowany dla 2 elementow o roznych wartosciach np. opacity czy transition...

mozesz mi podpowiedziec jak to zrobic?