View difference between Paste ID: YriQ2nBP and HqjCX6zk
SHOW: | | - or go back to the newest paste.
1
<!--
2
[คู่มือการใช้งาน]
3
สีหลัก: --ztngame-primary: #ff7f00;
4
ฟอนต์: --ztngame-font: 'Bai Jamjuree', sans-serif; *อย่าลืมเอาลิงก์ฟอนต์มาด้วย
5
6
----------------------------------------
7
8
***สำคัญ***
9
data-group="0" / name="game-0" / พวกมี -0 ต่อท้าย จะต้องไม่ซ้ำกันในแต่ละโพสต์
10
เช่น โพสต์ #1 (หัวกระทู้) ให้ใส่ data-group="0" / name="game-0" / -0 ต่อท้าย
11
    โพสต์ EP.1 (ตอนย่อย) ให้ใส่ data-group="1" / name="game-1" / -1 ต่อท้าย
12
    โพสต์ EP.2 (ตอนย่อย) ให้ใส่ data-group="2" / name="game-2" / -2 ต่อท้าย
13
    .
14
    .
15
    .
16
    โพสต์ EP.x (ตอนย่อย) ให้ใส่ data-group="x" / name="game-x" / -x ต่อท้าย
17
18
มีผลเฉพาะในกระทู้เดียวกัน หน้าเดียวกัน เท่านั้น
19
20
----------------------------------------
21
22
ถ้ารูปมีไม่ถึง 5 รูป ให้ลบ <label> ที่ไม่มีออกไป
23
เช่น มี 3 รูป ก็ลบ <label for="img4-0"></label> กับ <label for="img5-0"></label> ออก
24
25
----------------------------------------
26
27
สารบัญแต่ละตอน ถ้าต้องการเพิ่มตอน ให้ก๊อปข้างล่างไปเติม
28
29
<a href="--ลิงก์โพสต์ Ep.X--">
30
<div style="--ztngame-pic: url(--ลิงก์รูป Ep.X);"></div>
31
<div class="ztngame-ep"><b>EP.X</b>--ชื่อตอน--</div>
32
</a>
33
34
----------------------------------------
35
36
ตำแหน่งภาพ : เพิ่ม --ztngame-pos: 50% 50%; ต่อท้ายลิงก์รูปที่ต้องการปรับ
37
 - เลขตัวแรกคือการขยับซ้าย - ขวา โดย 0% = ชิดซ้าย 100% = ชิดขวา
38
 - เลขตัวแรกคือการขยับขึ้น - ลง โดย 0% = ชิดบน 100% = ชิดล่าง
39
 
40
ขนาดภาพ : เพิ่ม --ztngame-size: cover; ต่อท้ายลิงก์รูปที่ต้องการปรับ
41
 - cover คือ ขยายเต็มพื้นที่
42
 - 100% คือ ขนาดเดิมของรูป
43
 - มากกว่า 100% คือ ขนาดใหญ่ขึ้น
44
 - น้อยกว่า 100% คือ ขนาดเล็กลง
45
-->
46
47
48-
<link href="https://dl.dropbox.com/scl/fi/wp0zsaxx3l8kpzmgc51vl/zantino-game.css?rlkey=cw2qdt112xhmq07ltpoe59kqi&st=sjm6knoq" rel="stylesheet"><div id="ZantinoGame"><a href="https://discord.com/users/625292873914515456/"></a><div id="ztngame-thread" class="ztngame-box" style="--ztngame-primary: #ff7f00;--ztngame-font: 'Bai Jamjuree', sans-serif;" data-group="0">
48+
<link href="https://dl.dropbox.com/scl/fi/wp0zsaxx3l8kpzmgc51vl/zantino-game.css?rlkey=cw2qdt112xhmq07ltpoe59kqi&st=sjm6knoq" rel="stylesheet"><div id="ZantinoGame"><a href="https://discord.com/users/625292873914515456/"></a><div class="ztngame-box" style="--ztngame-primary: #ff7f00;--ztngame-font: 'Bai Jamjuree', sans-serif;" data-group="x">
49-
<input type="radio" name="game-0" data-item="yt" id="yt-0" checked />
49+
<input type="radio" name="game-x" data-item="yt" id="yt-x" checked />
50-
<input type="radio" name="game-0" data-item="img1" id="img1-0" />
50+
<input type="radio" name="game-x" data-item="img1" id="img1-x" />
51-
<input type="radio" name="game-0" data-item="img2" id="img2-0" />
51+
<input type="radio" name="game-x" data-item="img2" id="img2-x" />
52-
<input type="radio" name="game-0" data-item="img3" id="img3-0" />
52+
<input type="radio" name="game-x" data-item="img3" id="img3-x" />
53-
<input type="radio" name="game-0" data-item="img4" id="img4-0" />
53+
<input type="radio" name="game-x" data-item="img4" id="img4-x" />
54-
<input type="radio" name="game-0" data-item="img5" id="img5-0" />
54+
<input type="radio" name="game-x" data-item="img5" id="img5-x" />
55
<div class="ztngame-left">
56
<img src="--ลิงก์รูป โลโก้เกม--">
57
<details class="ztngame-details"><summary class="ztngame-summary"><i class="ztngame-warning-icon"></i><div class="ztngame-warning-title"><h3>Trigger Warning</h3>คลิกเพื่ออ่านรายละเอียด</div></summary>
58
เขียนบรรยาย tw หรือเขียนเป็นข้อก็ได้
59
[list]
60
[*]tw 1
61
[*]tw 2
62
[*]tw 3
63
[/list]
64
</details>
65
<div class="ztngame-gallery">
66
<iframe src="https://www.youtube.com/embed/--รหัสยูทูป--" frameborder="0" allowfullscreen></iframe>
67
<div img="img1" style="--ztngame-pic: url(--ลิงก์รูป screenshot--);"></div>
68
<div img="img2" style="--ztngame-pic: url(--ลิงก์รูป screenshot--);"></div>
69
<div img="img3" style="--ztngame-pic: url(--ลิงก์รูป screenshot--);"></div>
70
<div img="img4" style="--ztngame-pic: url(--ลิงก์รูป screenshot--);"></div>
71
<div img="img5" style="--ztngame-pic: url(--ลิงก์รูป screenshot--);"></div>
72
</div>
73-
<label for="yt-0" class="yt"></label>
73+
74-
<label for="img1-0"></label>
74+
<label for="yt-x" class="yt"></label>
75-
<label for="img2-0"></label>
75+
<label for="img1-x"></label>
76-
<label for="img3-0"></label>
76+
<label for="img2-x"></label>
77-
<label for="img4-0"></label>
77+
<label for="img3-x"></label>
78-
<label for="img5-0"></label></div>
78+
<label for="img4-x"></label>
79-
<h1>--ชื่อเกม--</h1>
79+
<label for="img5-x"></label></div>
80
<h1><b>EP.XX</b>--ชื่อตอนย่อย--</h1>
81
<div class="ztngame-content">--บรรยาย--</div>
82-
<div class="ztngame-right">
82+