היום למדתי: פונקציית random ב CSS
28/08/2025
אני מודה כששמעתי על הפיצ'ר random ב CSS השאלה הראשונה שלי היתה - מספרים אקראיים ב CSS? למה??
אבל אז הורדתי את Safari Technology Preview החדש וניסיתי למשל את הדמו של הכוכבים:
body {
background: black;
}
.star {
background-color: white;
border-radius: 50%;
aspect-ratio: 1/1;
width: random(2px, 10px, 1px);
position: fixed;
top: random(0%, 100%);
left: random(0%, 100%);
}
לינק לקודפן: https://codepen.io/ynonp/pen/XJmYaae
ובאמת יש משהו נחמד ברקע שכל פעם נטען עם כוכבים במקום אחר.
מצד שני - תמיכת דפדפנים מאוד בעייתית, אין קונצנזוס על הפיצ'ר ולא נראה שמישהו חוץ מאפל רוצה לבנות אותו (אין אפילו עמוד ב mdn או ב caniuse).
כאן יש מדריך די מקיף מהבלוג של וובקיט על הפיצ'ר וכל הדברים המדליקים שאפשר יהיה לעשות עם random יום אחד אם הוא ייכנס לחיים שלנו:
https://webkit.org/blog/17285/rolling-the-dice-with-css-random/
עד אז נמשיך להגריל ערכים באמצעות JavaScript.