کدهای جذاب و دیدنی ( Ocean ) : ساخت انیمیشن زیبا با SVG و Anime

در این قسمت میخوام یک کد ( Ocean ) جالب رو در اختیارتون بزارم.

دمو

توضیحات مربوط به کد Ocean

همونطور که دیدید تعدادی سه ضلعی وجود دارد که در کنار یکدیگر یک دلفین رو به وجود آوردند و بعد از اون به 1یی تبدیل به یک متن Ocean میشن. این سه ضلعی ها با استفاده از SVG به وجود اومدن و با استفاده از ابزار Anime.js اونا رو بصورت 1ی در میاریم.

برای مشاهده 1 این نمونه میتونین وارد بخش View Source بشید.

برای اینکار بصورت تصادفی یکی از المنتهای SVG رو انتخاب میکنیم و مسیر اون رو تغییر میدیم و در جای مورد نظرمون قرارش میدیم.

بدلیل اینکه حجم کدها زیاد بود ، اونارو در انتهای همین مطلب قرار میدم که میتونین اونو دانلود کرده و استفاده کنید. امیدوارم لذت برده باشین.

موفق باشید.

یا علی

لینک دانلود

Source

attractive beauty code CSS idea inspire Ocean