Heim > Web-Frontend > js-Tutorial > Hauptteil

Mechanisches und psychedelisches CSS-JavaScript-Tüfteln

WBOY
Freigeben: 2024-07-31 15:04:30
Original
646 Leute haben es durchsucht

Ich bin mit diesem Javascript/CSS-Animationskram einer Meinung. Ich lerne, Dinge besser zu kontrollieren, und es ist aufregend! Ich lerne, die Sache in meinem Kopf zu planen, bevor ich versuche, sie zu entwerfen (zumindest bis zu einem gewissen Grad). Der heutige Tag begann mit einer groben Idee, und ich begann wie folgt:

Mechanical & Psychedelic CSS-JavaScript Tinkering

Mit Javascript habe ich die Bilder dazu gebracht, sie mit (meinem neuen Lieblings-)Array und Schleifen zu wiederholen! Als ich zum ersten Mal Javascript lernte, dachte ich: „OK, Arrays für Daten.“ Ein besserer Gedanke sind Daten für was?! Wie wäre es mit lustigen, sich wiederholenden Formen! Ich bin besessen.

Hier ist ein Bild zur Veranschaulichung, aber ich sage Ihnen, dass die animierte Version viel cooler ist und Sie alle Animationen sehen können. Bitte schauen Sie sich den Github unten an, um es zu sehen!! (Ja, ich freue mich darüber. XD)

Also mit einfachem Javascript und CSS:

Mechanical device

Wer weiß, was das ist. Aber es hat definitiv eine mechanische Ausstrahlung mit einem leichten Hauch von Psychedelik. ef ja. Es hat ungefähr 4 Stunden gedauert, bis ich fertig war. Ich bin definitiv auf dem Weg, ein paar coole Sachen zu machen. Was erwartet uns in der Zukunft? Ein animierter psychedelischer Roboter? Sag nichts mehr. Könnte nicht aufgeregter sein. Danke fürs reinschauen!

Github: https://annavi11arrea1.github.io/circle/

Deshalb ist Code großartig...


Das obige ist der detaillierte Inhalt vonMechanisches und psychedelisches CSS-JavaScript-Tüfteln. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:dev.to
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!