הרבה שאלו איך יצרתי אפקט כוכבים זזים באתר הכל להשכרה.
אז הכנתי לכם הדרכה פשוטה כולל לינקים, שאתם, בוני האתרים, תוכלו ליצור אותם לבד.
האפקט הוא קוד פשוט ב- JAVA SCRIPT שלא מכביד על האתר.
אז קדימה,
קודם כל צריך שיהיה לכם אלמנטור מותקן בוורדפרס.
1- פותחים עמוד באלמנטור
בוחרים ויג'ט HTML וגוררים אותו לעמוד.2- תעתיקו את הקוד
ותכתבו אותו בתוך ה-HTML<style>
.particles-js-canvas-el {
width:100%;
height:100%;
position: absolute;
z-index: 0;
top:0;
}
</style>
<script src="https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"></script>
3- תפתחו תגית
<script> ותסגרו אותה </script>עוד מעט נכניס בפנים את הקוד של ג'אבה סקריפט עם אפקט הכוכבים.
4- תכנסו לאתר המגניב
פה, יש בו ספרייה מדהימה של אפקטים.נעבור על ההגדרות בשביל לבחור אפקט כוכבים.
דבר ראשון נבחר למעלה באופציה בצורה SNOW
ואז נלך לצורות SHAPE וב-TYPE נבחר צורת כוכב
בצלעות נבחר מספר 5 והנה לנו כוכב יפה
ועכשיו נשחק עוד קצת בהגדרות שיהיה מעניין.
לבחירת כמות הכוכבים:לבחירת גודל הכוכבים:
לבחירת שקיפות הכוכבים:
לבחירת צבע הכוכבים:
מגניב, נכון?
יאלה, בואו תכניסו את הקוד לאלמנטור שתוכלו לראות איך נראה באתר שלכם.5- אחרי שבחרתם את הצורה, צבע , כמות וכו' תלחצו על CODEPEN
יפתח לכם חלון חדש עם הקוד בג'אבה סקריפט.
6- תבחרו אותו ותעתיקו אותו
לתוך ויג'ט HTML שפתחתם באלמנטור בין התגיות של SCRIPT7- ולסיום,
תלכו לאזור / קונטיינר איפה שנמצא הויג'ט HTMLוב- מתקדם תכתבו ב-CSS את המזהה particles-js
עכשיו נשאר לכם רק לשמור את העמוד ולהנות מהאפקט המגניב.
אהבתם? תשאירו תגובה למטה, נשמח לקבל משוב
לעוד מאמרים מעניינים כנסו לאתר שלי https://p100plus.co.il/
רוצים גם חורף חם ועסק פורח, זה הזמן לסגור שיחת אפיון חינמית.
צרו קשר עוד היום.