איך להוסיף אנימציית קונפטי בפרויקט שבונים עם Svelte או SvelteKit

דבר ראשון יוצרים אנימצית קונפטי

צעד 0: יוצרים אנימצית קונפטי, מעצבים אותה בצבעי המותג שלך ובוחרים אנימציה שמוצאת חן בעיניך. אחרי שמסיימים, מקבלים קוד התקנה שנשתמש בו בהמשך המדריך.

צעד 1: לוחצים על הכפתור שאומר ״Copy Code" (העתק קוד).

צעד 2: נכנסים ל־SvelteKit. שם הולכים לדף המבוקש שנרצה להוסיף בו את אנימצית הקונפטי.

עכשיו מתקינים את קוד־הקונפטי בדף שלך

צעד 3: התקינו את קוד הקונפטי (תג script) לתוך קובץ app.html.

צעד 4. מנגנים את אנימציית הקונפטי על ידי הרצת הקוד הבא:

window.ConfettiPage.play()

יש אזהרת IntelliSense?

אם הפסים האדומים מפריעים לכם, אפשר ליצור קובץ global.d.ts תחת תיקייה /src ולהוסיף בו את הקוד הבא:

// src/global.d.ts
interface Window {
    ConfettiPage: {
        play(): void;
    };
}

זה יבטל את אזהרת ה־IntelliSense:

אופציונלי: להסיר את הקרדיט

אם השימוש שלך הוא בגרסא של קוד קונפטי חינמי, יוצג קרדיט של ״ConfettiPage.com" בתחתית הדף.

אם ברצונך להסיר את הקרדיט של ConfettiPage.com, אפשר לרכוש רישיון שימוש משודרג שיציג את הקונפטי ללא הקרדיט.