1,904
עריכות
אין תקציר עריכה
(Men770 העביר את הדף תבנית:מסגרת שקופה ל־תבנית:תוכן שקוף) |
אין תקציר עריכה |
||
| שורה 1: | שורה 1: | ||
# | <includeonly><div {{#ifeq:{{{הדגשה במעבר}}}|כן|class="ElementOpacity"}} style="opacity: {{{1}}};">{{{2}}}</div></includeonly><noinclude> | ||
תבנית זו משמשת ליצירת אובייקטים שקופים המכילים תגי <tt><nowiki><div></nowiki></tt> (למשל מסגרות). התבנית משתמשת במאפיין Opacity של [[גיליונות סגנון מדורגים|CSS]]. | |||
{{שימו לב|כדי ליצור טקסט שקוף או תמונה שקופה, יש להשתמש בתבנית '''{{תב|תוכן שקוף}}''' ולא בתבנית זו!}} | |||
התבנית הזו נועדה רק למקרים שבהם יש צורך לעשות שימוש בתגי <tt><nowiki><div></nowiki></tt> בתוכן השקוף, משום ששימוש כזה לא אפשרי בתבנית {{תב|תוכן שקוף}}. | |||
ניתן גם להוסיף אובייקטים ש{{תוכן שקוף|0.6|הדגשה במעבר=כן|מאבדים את שקיפותם כשעוברים מעליהם עם העכבר}}. תכונה זו עושה שימוש בעיצוב CSS שאינו קיים כברירת מחדל בתוכנת [[מדיה ויקי]]. לכן, אם ברצונכם לייצא את התבנית הזו לאתר ויקי אחר, יש להעתיק גם את הקוד הבא לקובץ ה־CSS של האתר: | |||
<syntaxhighlight lang="css"> | |||
.ElementOpacity:hover { | |||
opacity: 1 !important; | |||
}</syntaxhighlight> | |||
== אופן השימוש == | |||
לתבנית זו שני פרמטרים עיקריים. הפרמטר הראשון מגדיר את רמת השקיפות, והפרמטר השני קובע את התוכן שיוצג. | |||
'''הערה חשובה:''' יש להזין את הפרמטר <code>|2=</code> לפני התוכן השקוף. אחרת, ברוב המקרים התבנית לא תעבוד כראוי! | |||
רמת השקיפות יכולה להיות כל מספר מ־0 עד 1 (כלומר, מספרים עשרוניים). ככל שהמספר נמוך יותר, כך האובייקט שקוף יותר. | |||
כדי לקבוע שהאובייקט יהיה שקוף בהתחלה, אך יאבד את שקיפותו כשהקורא מעביר את העכבר מעליו, יש להשתמש בפרמטר <code>|הדגשה במעבר=כן</code>. | |||
=== דוגמאות לשימוש בתבנית === | |||
<table class="wikitable" width="92%"> | |||
<tr> | |||
<th>קוד ויקי</th> | |||
<th>תוצאה</th> | |||
</tr> | |||
<tr style="background: white;"> | |||
<td><pre>{{מסגרת שקופה|0.4|2= | |||
<div style="border: 1px solid black;"> | |||
מסגרת שקופה פשוטה | |||
</div> | |||
}}</pre></td> | |||
<td>{{מסגרת שקופה|0.4|2= | |||
<div style="border: 1px solid black;"> | |||
מסגרת שקופה פשוטה | |||
</div> | |||
}}</td> | |||
</tr> | |||
<tr style="background: white;"> | |||
<td><pre>{{מסגרת שקופה|0.35|2= | |||
<div style="border: 2px solid blue; background: #def; text-align: center;"> | |||
מסגרת שקופה מעוצבת | |||
</div> | |||
}}</pre></td> | |||
<td>{{מסגרת שקופה|0.35|2= | |||
<div style="border: 2px solid blue; background: #def; text-align: center;"> | |||
מסגרת שקופה מעוצבת | |||
</div> | |||
}}</td> | |||
</tr> | |||
<tr style="background: white;"> | |||
<td><pre>{{מסגרת שקופה|0.5|הדגשה במעבר=כן|2= | |||
<div style="border: 3px solid yellow; background: lightgreen; padding: 5px; text-align: center; color: darkred;"> | |||
'''אם תעבירו מעליי את העכבר, אני כבר לא אהיה שקופה.''' | |||
</div> | |||
}}</pre></td> | |||
<td>{{מסגרת שקופה|0.5|הדגשה במעבר=כן|2= | |||
<div style="border: 3px solid yellow; background: lightgreen; padding: 5px; text-align: center; color: darkred;"> | |||
'''אם תעבירו מעליי את העכבר, אני כבר לא אהיה שקופה.''' | |||
</div> | |||
}}</td> | |||
</tr> | |||
<tr style="background: white;"> | |||
<td><pre>העבירו את העכבר מעל העיגול הזה כדי לראות אותו כמו שצריך: | |||
{{מסגרת שקופה|0.15|הדגשה במעבר=כן|2= | |||
<div style="border: 4px solid pink; background: blue; border-radius: 50%; width: 40px; height: 40px;"></div> | |||
}}</pre></td> | |||
<td>העבירו את העכבר מעל העיגול הזה כדי לראות אותו כמו שצריך: | |||
{{מסגרת שקופה|0.15|הדגשה במעבר=כן|2= | |||
<div style="border: 4px solid pink; background: blue; border-radius: 50%; width: 40px; height: 40px;"></div> | |||
}}</td> | |||
</tr> | |||
</table> | |||
[[קטגוריה:תבניות עיצוב]] | |||