תבנית:מסגרת שקופה: הבדלים בין גרסאות בדף

(11 גרסאות ביניים של 5 משתמשים אינן מוצגות)

שורה 1:

תבנית זו משמשת ליצירת אובייקטים שקופים המכילים תגי <tt><nowiki><div></nowiki></tt> (למשל מסגרות). התבנית משתמשת במאפיין Opacity של [[גיליונות סגנון מדורגים|CSS]].

תבנית זו משמשת ליצירת אובייקטים שקופים המכילים תגי <code><nowiki><div></nowiki></code> (למשל מסגרות). התבנית משתמשת במאפיין Opacity של [[גיליונות סגנון מדורגים|CSS]].

~~[[קובץ:Attention yellow.png|16 פיקסלים|קישור=]] '''~~שימו לב~~:'''~~ כדי ליצור טקסט שקוף או תמונה שקופה, יש להשתמש בתבנית '''{{תב|תוכן שקוף}}''' ולא בתבנית זו!

{{שימו לב|כדי ליצור טקסט שקוף או תמונה שקופה, יש להשתמש בתבנית '''{{תב|תוכן שקוף}}''' ולא בתבנית זו!}}

התבנית הזו נועדה רק למקרים שבהם יש צורך לעשות שימוש בתגי <tt><nowiki><div></nowiki></tt> בתוכן השקוף, משום ששימוש כזה לא אפשרי בתבנית {{תב|תוכן שקוף}}.

התבנית הזו נועדה רק למקרים שבהם יש צורך לעשות שימוש בתגי <code><nowiki><div></nowiki></code> בתוכן השקוף, משום ששימוש כזה לא אפשרי בתבנית {{תב|תוכן שקוף}}.

ניתן גם להוסיף אובייקטים ש{{תוכן שקוף|0.6|הדגשה במעבר=כן~~|[[#אובייקטים שמאבדים את שקיפותם כשעוברים מעליהם עם העכבר~~|מאבדים את שקיפותם כשעוברים מעליהם עם העכבר]]}}. תכונה זו עושה שימוש בעיצוב CSS שאינו קיים כברירת מחדל בתוכנת [[מדיה ויקי]]. לכן, אם ברצונכם לייצא את התבנית הזו לאתר ויקי אחר, יש להעתיק גם את הקוד הבא לקובץ ה־CSS של האתר:

ניתן גם להוסיף אובייקטים ש{{תוכן שקוף|0.6|הדגשה במעבר=כן|מאבדים את שקיפותם כשעוברים מעליהם עם העכבר}}. תכונה זו עושה שימוש בעיצוב CSS שאינו קיים כברירת מחדל בתוכנת [[מדיה ויקי]]. לכן, אם ברצונכם לייצא את התבנית הזו לאתר ויקי אחר, יש להעתיק גם את הקוד הבא לקובץ ה־CSS של האתר:

.ElementOpacity:hover {

opacity: 1 !important;

}</syntaxhighlight>

== אופן השימוש ==

לתבנית זו שני פרמטרים עיקריים. הפרמטר הראשון מגדיר את רמת השקיפות, והפרמטר השני קובע את התוכן שיוצג.

'''הערה חשובה:''' יש להזין את הפרמטר <code>|2=</code> לפני התוכן השקוף. אחרת, ברוב המקרים התבנית לא תעבוד כראוי!

רמת השקיפות יכולה להיות כל מספר מ־0 עד 1 (כלומר, מספרים עשרוניים). ככל שהמספר נמוך יותר, כך האובייקט שקוף יותר.

כדי לקבוע שהאובייקט יהיה שקוף בהתחלה, אך יאבד את שקיפותו כשהקורא מעביר את העכבר מעליו, יש להשתמש בפרמטר <code>|הדגשה במעבר=כן</code>.

=== דוגמאות לשימוש בתבנית ===

<tr>

<th>תוצאה</th>

</tr>

<td><pre>{{מסגרת שקופה|0.4|2=

מסגרת שקופה פשוטה

</div>

}}</pre></td>

<td>{{מסגרת שקופה|0.4|2=

מסגרת שקופה פשוטה

</div>

}}</td>

</tr>

<td><pre>{{מסגרת שקופה|0.35|2=

מסגרת שקופה מעוצבת

</div>

}}</pre></td>

<td>{{מסגרת שקופה|0.35|2=

מסגרת שקופה מעוצבת

</div>

}}</td>

</tr>

<td><pre>{{מסגרת שקופה|0.5|הדגשה במעבר=כן|2=

'''אם תעבירו מעליי את העכבר, אני כבר לא אהיה שקופה.'''

</div>

}}</pre></td>

<td>{{מסגרת שקופה|0.5|הדגשה במעבר=כן|2=

'''אם תעבירו מעליי את העכבר, אני כבר לא אהיה שקופה.'''

</div>

}}</td>

</tr>

<td><pre>העבירו את העכבר מעל העיגול הזה כדי לראות אותו כמו שצריך:

{{מסגרת שקופה|0.15|הדגשה במעבר=כן|2=

}}</pre></td>

<td>העבירו את העכבר מעל העיגול הזה כדי לראות אותו כמו שצריך:

{{מסגרת שקופה|0.15|הדגשה במעבר=כן|2=

}}</td>

</tr>

</table>

<noinclude>[[קטגוריה:תבניות עיצוב תמונות]]</noinclude>

@@ שורה 1: / שורה 1: @@
-תבנית זו משמשת ליצירת אובייקטים שקופים המכילים תגי <tt><nowiki><div></nowiki></tt> (למשל מסגרות). התבנית משתמשת במאפיין Opacity של [[גיליונות סגנון מדורגים|CSS]].
+<includeonly><div {{#ifeq:{{{הדגשה במעבר}}}|כן|class="ElementOpacity"}} style="opacity: {{{1}}};">{{{2}}}</div></includeonly><noinclude>
+תבנית זו משמשת ליצירת אובייקטים שקופים המכילים תגי <code><nowiki><div></nowiki></code> (למשל מסגרות). התבנית משתמשת במאפיין Opacity של [[גיליונות סגנון מדורגים|CSS]].
-[[קובץ:Attention yellow.png|16 פיקסלים|קישור=]] '''שימו לב:''' כדי ליצור טקסט שקוף או תמונה שקופה, יש להשתמש בתבנית '''{{תב|תוכן שקוף}}''' ולא בתבנית זו!
+{{שימו לב|כדי ליצור טקסט שקוף או תמונה שקופה, יש להשתמש בתבנית '''{{תב|תוכן שקוף}}''' ולא בתבנית זו!}}
-התבנית הזו נועדה רק למקרים שבהם יש צורך לעשות שימוש בתגי <tt><nowiki><div></nowiki></tt> בתוכן השקוף, משום ששימוש כזה לא אפשרי בתבנית {{תב|תוכן שקוף}}.
+התבנית הזו נועדה רק למקרים שבהם יש צורך לעשות שימוש בתגי <code><nowiki><div></nowiki></code> בתוכן השקוף, משום ששימוש כזה לא אפשרי בתבנית {{תב|תוכן שקוף}}.
-ניתן גם להוסיף אובייקטים ש{{תוכן שקוף|0.6|הדגשה במעבר=כן|[[#אובייקטים שמאבדים את שקיפותם כשעוברים מעליהם עם העכבר|מאבדים את שקיפותם כשעוברים מעליהם עם העכבר]]}}. תכונה זו עושה שימוש בעיצוב CSS שאינו קיים כברירת מחדל בתוכנת [[מדיה ויקי]]. לכן, אם ברצונכם לייצא את התבנית הזו לאתר ויקי אחר, יש להעתיק גם את הקוד הבא לקובץ ה־CSS של האתר:
+ניתן גם להוסיף אובייקטים ש{{תוכן שקוף|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>
+<noinclude>[[קטגוריה:תבניות עיצוב תמונות]]</noinclude>