#css #webdev #cssdemo
@larvaexotech: Wygrzebałem z dysku sprzed dwóch lat plik html loadera obrotowego wykonanej za pomocą tej instrukcji
(W odpowiedzi na to pytanie)

No i mamy efekt końcowy (miały być sześciany)
#cssdemo #css #javascript #webdev
źródło (⌐ ͡■ ͜ʖ ͡■)

Efekt niezamierzony, ale wygląda dość imponująco.
Tu (codepen) można śledzić zmiany.
#cssdemo #css #javascript #webdev

Pokaż spoiler

Tym razem w wersji 3D ʕ•ᴥ•ʔ

Pokaż spoiler

#cssdemo #html #css #webdev #gif #wykop

Chciałem wypróbować nowości jakie wprowadzają w CSS (dostępne od Chrome 49, Firefox już aktualne).
Animacja napisana w czystym CSS (⌐ ͡■ ͜ʖ ͡■)
#html #css #cssdemo #webdev #gif #wykop

1000 wyświetleń, w końcu :)
Wszystkie elementy w samym CSS, nawet otwierająca klapa.
Obrót kamery z innego przykładu. A JS słyży jedynie jako pre-procesor.
link
#programowanie #webdev #codepen #cssdemo

Zrobiłem ten domek ostatnio, a na główną dostały się moje stare zbugowane skrzynie sprzed kilku miesięcy. Dlatego musiałem odświeżyć kod, by ogarnąć bałagan. ( ͡° ͜ʖ ͡°)
LINK
#html #css #javascript #css #css3d #webdev #cssdemo

Chciałem na szybko, zeszło kilka godzin. Miks obrotu kamery razem z klikalnymi elementami.
Jak zwykle, żadnych bibliotek. LINK
( ͡° ͜ʖ ͡°)
#webdev #html #javascript #css #css3d #cssdemo

Tak mniej więcej wygląda rozmieszczenie div'ów bo ekranie z przykładu poniżej
(body > div1 > div2 > {div3*} )
Ale zamiast kwadratów pomocniczych, stosuję "left-top"
#javascript #webdev #css ( #cssdemo )

Pierwszy mój przykład z wykorzystaniem klawiatury. Wcześniej opanowałem śledzenie położenia myszki na ekranie
Skorzystałem z prostego wzoru na promień wewnętrzny wielokąta foremnego (taka figura geometryczna o równych bokach i kątach) (nie z pamięci ( ͡° ͜ʖ ͡°)), by obliczyć wartości do transform-origin: X Y Z; Prostokąty te od pewnej pozycji w obrocie mają znikać, by nie wszystkie elementy latały po ekranie.
#javascript #css #Pokaż całość