אלה מכם שכתבו HTML במשך זמן רב עשויים לזכור את האלמנט. זה היה אלמנט ספציפי לדפדפן שיצר כרזה של טקסט גלילה על פני המסך. אלמנט זה מעולם לא נוסף למפרט HTML והתמיכה בו השתנתה באופן נרחב בין דפדפנים. אנשים היו לעתים קרובות דעות מאוד חזק על השימוש של אלמנט זה - הן חיוביות ושליליות. אבל אם אתה אוהב או שונא את זה, זה היה לשרת את המטרה של יצירת תוכן כי overflowed גבולות תיבת גלוי.
חלק מהסיבה היא מעולם לא יושמה במלואה על ידי הדפדפנים, מלבד דעה אישית חזקה, היה זה נחשב אפקט חזותי וככזה, זה לא צריך להיות מוגדר על ידי ה- HTML, אשר מגדיר את המבנה. במקום זאת, אפקטים חזותיים או מצגות צריכים להיות מנוהלים על ידי CSS. ו- CSS3 מוסיף את מודול האוהל כדי לקבוע כיצד הדפדפנים מוסיפים את אפקט האוהל למרכיבים.
תכונות CSS3 חדשות
CSS3 מוסיפה חמישה מאפיינים חדשים שיסייעו לך לשלוט על האופן שבו התוכן שלך מוצג בסגנונות: סגנון הצפה, סגנון סימון, מרקי-פליי-ספירה, כיוון האוהל והמהירות.
גלישה בסגנון
המאפיין בסגנון overflow (שבו דנתי גם במאמר CSS Overflow) מגדיר את הסגנון המועדף לתוכן העולה על תיבת התוכן. אם אתם מגדירים את הערך לסרגלי האוהל או לסגירת האוהל, התוכן שלכם יחליק פנימה והחוצה לשמאל / ימין (קו האוהל) או למעלה / למטה (בלוק סימון).
בסגנון מארקי
מאפיין זה מגדיר כיצד התוכן יעבור אל התצוגה (ולצאת).
האפשרויות הן גלילה, שקופית וחלופה. הגלילה מתחילה בתוכן כבוי לחלוטין, ולאחר מכן היא נעה על פני השטח הגלוי עד שכל המסך כבוי לחלוטין. Slide מתחיל עם תוכן לחלוטין את המסך ולאחר מכן הוא עובר על פני עד התוכן יש מלא עבר על המסך ואין תוכן נוסף נותר להחליק על המסך.
לבסוף, חלופי מחזיר את התוכן מצד לצד, מחליק קדימה ואחורה.
ספירת מחזה
אחד החסרונות של שימוש באלמנט MARQUEE הוא כי האוהל לא מפסיק. אבל עם תכונה בסגנון מארקי לשחק- count אתה יכול להגדיר את האוהל כדי לסובב את התוכן לסירוגין עבור מספר מסוים של פעמים.
כיוון האוהל
אתה יכול גם לבחור את הכיוון כי התוכן צריך לגלול על המסך. הערכים קדימה לאחור מבוססים על כיווניות של הטקסט, כאשר סגנון הצפת הוא קו האוהדים למעלה או למטה כאשר סגנון הצפת הוא בלוק אפור.
פרטים על כיוון מארקי
| גלישה בסגנון | כיוון שפה | קָדִימָה | לַהֲפוֹך |
|---|---|---|---|
| מארקי-ליין | ltr | שמאלה | ימין |
| rtl | ימין | שמאלה | |
| בלוק | לְמַעלָה | מטה |
מהירות מארקי
תכונה זו קובעת באיזו מהירות התוכן גולל על המסך. הערכים הם איטיים, נורמליים ומהירים. המהירות בפועל תלויה בתוכן ובדפדפן המציג אותו, אבל הערכים חייבים להיות איטיים יותר איטיים מהרגיל, וזה איטי יותר מהר.
תמיכה בדפדפן של המאפיינים מארקי
ייתכן שיהיה עליך להשתמש בקידומת הספק כדי לקבל את רכיבי CSS של האוהל כדי לעבוד. הם כדלקמן:
| CSS3 | קידומת ספק |
|---|---|
| Overflow-x: marquee-line; | overflow-x: -webkit-marquee; |
| בסגנון מארקי | -וייטקיט-בסגנון מארקי |
| ספירת מחזה | - חזרות - חזרה על האוהל |
| מארק-כיוון: קדימה; | -webkit-marqueee-לכיוון: קדימה אחורה; |
| מהירות מארקי | -webkit-מהירות האוהל |
| לא שווה ערך | -webkit-marqueee-extra |
המאפיין האחרון מאפשר לך להגדיר כמה גדול או קטן הצעדים צריך להיות כמו תוכן מגילות על המסך של האוהל.
כדי שהמערך שלך יעבוד, עליך למקם תחילה את ערכי הקידומת של הספק ולאחר מכן לבצע אותם עם ערכי מפרט CSS3. לדוגמה, הנה CSS עבור אוהל כי מגילות הטקסט חמש פעמים משמאל לימין בתוך תיבת 200x50.
{
רוחב: 200px; גובה: 50px; White-space: nowrap;
overflow: hidden;
overflow-x: -webkit-marquee;
-webkit-marqueee לכיוון: קדימה;
-webitit בסגנון marquee: גלילה;
-webkit-מהירות האוהל: רגיל;
-webkit-marqueee-extrament: קטן;
-webkit-marqueee-repetition: 5;
Overflow-x: marquee-line;
מארק-כיוון: קדימה;
בסגנון מרקי: גלילה;
מהירות מארקי: רגילה;
מחזה-משחק-ספירה: 5;
}