תבנית:תוכן שקוף – הבדלי גרסאות

תוכן שנמחק תוכן שנוסף

בשורה

גרסה אחרונה מ־16:16, 20 באוגוסט 2018

תבנית זו משמשת ליצירת תמונות וטקסטים שקופים. התבנית משתמשת במאפיין Opacity של CSS.

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

כמו כן, ניתן להוסיף תוכן שמאבד את שקיפותו כשעוברים מעליו עם העכבר. תכונה זו עושה שימוש בעיצוב CSS שאינו קיים כברירת מחדל בתוכנת מדיה ויקי. לכן, אם ברצונכם לייצא את התבנית הזו לאתר ויקי אחר, יש להעתיק גם את הקוד הבא לקובץ ה־CSS של האתר:

.ElementOpacity:hover {
    opacity: 1 !important;
}

שימו לב: מסיבות טכניות, התבנית הזו לא מאפשרת להשתמש בתכנים עם תגי <div> (בעיקר מסגרות). לפיכך, אם ברצונכם ליצור מסגרת שקופה, או כל תוכן שקוף אחר שדורש שימוש בתגי <div>, יש להשתמש בתבנית {{מסגרת שקופה}} ולא בתבנית זו.

אופן השימוש

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

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

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

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

טקסט בסיסי
קוד ויקי	תוצאה
`{{תוכן שקוף\|0.7\|זהו טקסט שקוף}}`	זהו טקסט שקוף
`{{תוכן שקוף\|0.4\|זהו טקסט שקוף מאוד}}`	זהו טקסט שקוף מאוד
`{{תוכן שקוף\|0.5\|'''זהו טקסט מודגש וגם שקוף'''}}`	זהו טקסט מודגש וגם שקוף

טקסט מעוצב הערה חשובה: כדי להשתמש בטקסטים מעוצבים בתבנית הזו, יש להזין את הפרמטר `\|2=` לפני התוכן, כמודגם להלן.
קוד ויקי	תוצאה
{{תוכן שקוף\|0.45\|2= <span style="color: green;">זהו טקסט שקוף בצבע ירוק</span> }}	זהו טקסט שקוף בצבע ירוק
{{תוכן שקוף\|0.75\|2= <span style="background: lightyellow;">זהו טקסט שקוף עם רקע צהוב</span> }}	זהו טקסט שקוף עם רקע צהוב

תמונות
קוד ויקי	תוצאה
{{תוכן שקוף\|0.3\| [[קובץ:Wikipedia-logo.svg]] }}
{{תוכן שקוף\|0.2 \|2=[[קובץ:Achtung.svg\|מרכז\|100 פיקסלים]] }}

תבניות
קוד ויקי	תוצאה
{{תוכן שקוף\|0.35\| הנה תבנית שקופה: {{מזל טוב}} }}	הנה תבנית שקופה: מ ז ל ט ו ב !
`פרצופים שקופים: {{תוכן שקוף\|0.5\|{{חיוך}} {{עצוב}} {{צחוק}}}}`	פרצופים שקופים:

תוכן שמאבד את שקיפותו בעת מעבר עכבר ניתן להשתמש באפשרות זו כדי להדגיש תוכן כשהקורא "מרחף" מעליו באמצעות העכבר. לשם כך, יש להשתמש בפרמטר `\|הדגשה במעבר=כן`.
קוד ויקי	תוצאה
{{תוכן שקוף\|0.6\|הדגשה במעבר=כן\| הטקסט הזה יהיה כהה יותר כשתעבירו מעליו את העכבר. }}	הטקסט הזה יהיה כהה יותר כשתעבירו מעליו את העכבר.
{{תוכן שקוף\|0.47\|הדגשה במעבר=כן\|2= <span style="color: red; background: yellow;">'''הטקסט המעוצב הזה יהיה בולט יותר כשתעבירו מעליו את העכבר.'''</span> }}	הטקסט המעוצב הזה יהיה בולט יותר כשתעבירו מעליו את העכבר.
התמונה הזו תהיה כהה יותר כשתעבירו מעליה את העכבר: {{תוכן שקוף\|0.65\|הדגשה במעבר=כן\| [[קובץ:Arctic Foxes (8154290495).jpg\|120px]] }}	התמונה הזו תהיה כהה יותר כשתעבירו מעליה את העכבר:

@@ שורה 1: / שורה 1: @@
-<includeonly><span {{#ifeq:{{{הדגשה במעבר}}}|כן|class="ElementOpacity"}} style="opacity: {{{1}}};">{{{2}}}</span></includeonly><noinclude>
+<includeonly><span {{#ifeq:{{{הדגשה במעבר}}}|כן|class="ElementOpacity"}} style="opacity: {{{1|1}}};">{{{2|}}}</span></includeonly><noinclude>
-תבנית זו משמשת ליצירת אובייקטים שקופים. התבנית משתמשת במאפיין Opacity של [[גיליונות סגנון מדורגים|CSS]].
+תבנית זו משמשת ליצירת תמונות וטקסטים שקופים. התבנית משתמשת במאפיין Opacity של [[גיליונות סגנון מדורגים|CSS]].
-באמצעות התבנית ניתן להפוך כמעט כל תוכן ל{{תוכן שקוף|0.6|שקוף}}: תמונות, טקסט ואלמנטים נוספים.
+באמצעות התבנית ניתן להפוך טקסטים רגילים, טקסטים מעוצבים, תמונות ואלמנטים נוספים ל{{תוכן שקוף|0.6|שקופים}}.
-כמו כן, ניתן להוסיף תוכן ש{{תוכן שקוף|0.6|הדגשה במעבר=כן|מאבד את שקיפותו כשמרחפים עליו עם העכבר}}.
+כמו כן, ניתן להוסיף תוכן ש{{תוכן שקוף|0.6|הדגשה במעבר=כן|[[#תוכן שמאבד את שקיפותו בעת מעבר עכבר|מאבד את שקיפותו כשעוברים מעליו עם העכבר]]}}. תכונה זו עושה שימוש בעיצוב CSS שאינו קיים כברירת מחדל בתוכנת [[מדיה ויקי]]. לכן, אם ברצונכם לייצא את התבנית הזו לאתר ויקי אחר, יש להעתיק גם את הקוד הבא לקובץ ה־CSS של האתר:
+<syntaxhighlight lang="css">
+.ElementOpacity:hover {
+    opacity: 1 !important;
+}</syntaxhighlight>
+{{שימו לב|מסיבות טכניות, התבנית הזו לא מאפשרת להשתמש בתכנים עם תגי <tt><nowiki><div></nowiki></tt> (בעיקר מסגרות). לפיכך, אם ברצונכם ליצור מסגרת שקופה, או כל תוכן שקוף אחר שדורש שימוש בתגי <tt><nowiki><div></nowiki></tt>, יש להשתמש בתבנית '''{{תב|מסגרת שקופה}}''' ולא בתבנית זו.}}
 == אופן השימוש ==
@@ שורה 11: / שורה 17: @@
 רמת השקיפות יכולה להיות כל מספר מ־0 עד 1 (כלומר, מספרים עשרוניים). ככל שהמספר נמוך יותר, כך הטקסט שקוף יותר.
-כדי לקבוע שהתוכן יהיה שקוף בהתחלה, אך יאבד את שקיפותו כשהקורא/ת עובר/ת עם העבר מעליו, יש להשתמש בפרמטר <code>|הדגשה במעבר=כן</code>.
+כדי לקבוע שהתוכן יהיה שקוף בהתחלה, אך יאבד את שקיפותו כשהקורא מעביר את העכבר מעליו, יש להשתמש בפרמטר <code>|הדגשה במעבר=כן</code>.
 === דוגמאות לשימוש בתבנית ===
-<table class="wikitable" width="85%">
+<table class="wikitable" width="92%">
 <tr>
 <th colspan="2" style="background: #fffff4; font-size: 110%;">טקסט בסיסי</th>
@@ שורה 36: / שורה 42: @@
 </table>
-<table class="wikitable" style="margin-top: -7px;" width="85%">
+<table class="wikitable" style="margin-top: -7px;" width="92%">
 <tr>
 <th colspan="2" style="background: #fffff4;"><span style="font-size: 110%;">טקסט מעוצב</span><br /><span style="font-weight: normal; font-size: 85%;">'''הערה חשובה:''' כדי להשתמש בטקסטים מעוצבים בתבנית הזו, יש להזין את הפרמטר <code>|2=</code> לפני התוכן, כמודגם להלן.</span></th>
@@ שורה 56: / שורה 62: @@
 <td>{{תוכן שקוף|0.75|2=<span style="background: lightyellow;">זהו טקסט שקוף עם רקע צהוב</span>}}</td>
 </tr>
+</table>
-<table class="wikitable" style="margin-top: -7px;" width="85%">
+<table class="wikitable" style="margin-top: -7px;" width="92%">
 <tr>
 <th colspan="2" style="background: #fffff4; font-size: 110%;">תמונות</th>
@@ שורה 72: / שורה 79: @@
 </tr>
 <tr style="background: white;">
-<td><pre>{{תוכן שקוף|0.2|
+<td><pre>{{תוכן שקוף|0.2
-[[קובץ:Achtung.svg|מרכז|100 פיקסלים]]
+|2=[[קובץ:Achtung.svg|מרכז|100 פיקסלים]]
 }}</pre></td>
-<td>{{תוכן שקוף|0.2|[[קובץ:Achtung.svg|מרכז|100 פיקסלים]]}}</td>
+<td>{{תוכן שקוף|0.2
+|2=[[קובץ:Achtung.svg|מרכז|100 פיקסלים]]
+}}</td>
 </tr>
+</table>
+<table class="wikitable" style="margin-top: -7px;" width="92%">
+<tr>
+<th colspan="2" style="background: #fffff4; font-size: 110%;">תבניות</th>
+</tr>
+<tr>
+<th>קוד ויקי</th>
+<th>תוצאה</th>
+</tr>
+<tr style="background: white;">
+<td><pre>{{תוכן שקוף|0.35|
+הנה תבנית שקופה: {{מזל טוב}}
+}}</pre></td>
+<td>{{תוכן שקוף|0.35|הנה תבנית שקופה: {{מזל טוב}}}}</td>
+</tr>
+<tr style="background: white;">
+<td><code><nowiki>פרצופים שקופים: {{תוכן שקוף|0.5|{{חיוך}} {{עצוב}} {{צחוק}}}}</nowiki></code>
+<td>פרצופים שקופים: {{תוכן שקוף|0.5|{{חיוך}} {{עצוב}} {{צחוק}}}}</td>
+</tr>
+</table>
+<table class="wikitable" style="margin-top: -7px;" width="92%">
+<tr>
+<th colspan="2" style="background: #fffff4;"><span style="font-size: 110%;">{{עוגן|תוכן שמאבד את שקיפותו בעת מעבר עכבר|תוכן שמאבד את שקיפותו בעת מעבר עכבר}}</span><br /><span style="font-weight: normal; font-size: 85%;">ניתן להשתמש באפשרות זו כדי להדגיש תוכן כשהקורא "מרחף" מעליו באמצעות העכבר. לשם כך, יש להשתמש בפרמטר <code>|הדגשה במעבר=כן</code>.</span></th>
+</tr>
+<tr>
+<th>קוד ויקי</th>
+<th>תוצאה</th>
+</tr>
+<tr style="background: white;">
+<td><pre>{{תוכן שקוף|0.6|הדגשה במעבר=כן|
+הטקסט הזה יהיה כהה יותר כשתעבירו מעליו את העכבר.
+}}</pre></td>
+<td>{{תוכן שקוף|0.6|הדגשה במעבר=כן|
+הטקסט הזה יהיה כהה יותר כשתעבירו מעליו את העכבר.
+}}</td>
+</tr>
+<tr style="background: white;">
+<td><pre>{{תוכן שקוף|0.47|הדגשה במעבר=כן|2=
+<span style="color: red; background: yellow;">'''הטקסט המעוצב הזה יהיה בולט יותר כשתעבירו מעליו את העכבר.'''</span>
+}}</pre></td>
+<td>{{תוכן שקוף|0.47|הדגשה במעבר=כן|2=
+<span style="color: red; background: yellow;">'''הטקסט המעוצב הזה יהיה בולט יותר כשתעבירו מעליו את העכבר.'''</span>
+}}</td>
+</tr>
+<tr style="background: white;">
+<td><pre>התמונה הזו תהיה כהה יותר כשתעבירו מעליה את העכבר:
+{{תוכן שקוף|0.65|הדגשה במעבר=כן|
+[[קובץ:Arctic Foxes (8154290495).jpg|120px]]
+}}</pre></td>
+<td>התמונה הזו תהיה כהה יותר כשתעבירו מעליה את העכבר:
+{{תוכן שקוף|0.65|הדגשה במעבר=כן|
+[[קובץ:Arctic Foxes (8154290495).jpg|120px]]
+}}</td>
+</tr>
+[[קטגוריה:תבניות עיצוב וסגנון של טקסטים]]