模板討論:切換顯示按鈕

添加新參數

@AnnAngela，サンムル有沒有可能給這個按鈕模板加@on和@off參數？這樣可以在按鈕激活時顯示一些文字，未激活時顯示另一些文字。——我是亙古輪迴Colby，2 0 5 3 / 0 8 2 3 / 2 9 7 0 / 2 7 9 9 / 5 0 4 2 /。 2020年5月18日 (一) 17:29 (CST)

Done. 文檔已更新。——From AnnAngela the Temporary Bureaucrat (Talk) 2020年5月18日 (一) 23:28 (CST)

@亘古轮回，忘了說，我只更新了示例部分，用法部分還需要你跟進。（示例也只加在第一個按鈕上，需要的話可以多加幾個【另外，字符串代號只有末尾是@on或@off時才會被視為開關文本，@帶其他字符都會被視為代號整體（如asd@asd就是一個整體，asd@on就是asd的on狀態）】）——From AnnAngela the Temporary Bureaucrat (Talk) 2020年5月19日 (二) 17:41 (CST)

剛剛已經弄好了，我看到更新就會更新文檔的。——我是亙古輪迴Colby，2 0 5 3 / 0 8 2 3 / 2 9 7 0 / 2 7 9 9 / 5 0 4 2 /。 2020年5月19日 (二) 18:09 (CST)

申請添加新樣式參數

@AnnAngela請問是否可以添加新的樣式用來調整複選框的對勾背景色和單選框圓點的顏色？——我是亙古輪迴Colby，2 0 5 3 / 0 8 2 3 / 2 9 7 0 / 2 7 9 9 / 5 0 4 2 /。 2020年5月28日 (四) 21:19 (CST)

Done. 在{{切換顯示按鈕樣式}}中追加新參數【字符串代号】@input用以指定複選框/單選框樣式，已經更新在Template:切換顯示/doc/示例的第七段話處，請協助完善文檔。——From AnnAngela the Temporary Bureaucrat (Talk) 2020年5月29日 (五) 15:02 (CST)

謝謝，麻煩你了。——我是亙古輪迴Colby，2 0 5 3 / 0 8 2 3 / 2 9 7 0 / 2 7 9 9 / 5 0 4 2 /。 2020年5月29日 (五) 22:55 (CST)

@AnnAngela我想問一下對勾和圓點的顏色該怎麼改？我看了一下widget的樣式，裡面沒有相關代碼，這個是用的默認樣式嗎？——我是亙古輪迴Colby，2 0 5 3 / 0 8 2 3 / 2 9 7 0 / 2 7 9 9 / 5 0 4 2 /。 2020年5月30日 (六) 11:01 (CST)

你可能需要appearance:none;（因為此類輸入框的樣式基本上都被瀏覽器鎖定，所以你需要解除這種鎖定，但同樣的，你會幾乎無法體現出單選框/複選框是否被勾選）——From AnnAngela the Temporary Bureaucrat (Talk) 2020年5月30日 (六) 16:38 (CST)

明白了。——我是亙古輪迴Colby，2 0 5 3 / 0 8 2 3 / 2 9 7 0 / 2 7 9 9 / 5 0 4 2 /。 2020年5月30日 (六) 18:27 (CST)

@AnnAngela您好，有人反映說在周五那天加了@input以後夸克瀏覽器和魅族瀏覽器顯示不了這個模板了（即使模板里沒這個參數）。——我是亙古輪迴Colby，2 0 5 3 / 0 8 2 3 / 2 9 7 0 / 2 7 9 9 / 5 0 4 2 /。 2020年5月31日 (日) 12:31 (CST)

@亘古轮回 可能因為緩存問題，請等待緩存更新。或者在預覽後複製當前標籤到新的標籤（大部分瀏覽器都支持這個功能）有大概率能看到效果。--サンムル（討論） 2020年5月31日 (日) 12:50 (CST)

不知道咋回事，他們還沒有回應。——我是亙古輪迴Colby，2 0 5 3 / 0 8 2 3 / 2 9 7 0 / 2 7 9 9 / 5 0 4 2 /。 2020年5月31日 (日) 17:29 (CST)

@亘古轮回 請讓出現問題的同學打開 https://annangela.moe/moegirlpedia/browserinfo.html 並複製裡面的信息發在這裡我看看。——From AnnAngela the Temporary Bureaucrat (Talk) 2020年5月31日 (日) 15:11 (CST)

已經和他們說了，麻煩你稍等一下。——我是亙古輪迴Colby，2 0 5 3 / 0 8 2 3 / 2 9 7 0 / 2 7 9 9 / 5 0 4 2 /。 2020年5月31日 (日) 17:29 (CST)

@AnnAngela

瀏覽器信息
UserAgent: Mozilla/5.0 (Linux; U; Android 6.0.1; zh-CN; M3X Build/MMB29U) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/57.0.2987.108 Quark/4.1.2.133 Mobile Safari/537.36 屏幕高度: 640px 宽度: 360px 缩放: 浏览器不支持 visualViewport / 3x(该数值已考虑系统的缩放值) 可见高度: 浏览器不支持 visualViewport 可见宽度: 浏览器不支持 visualViewport 方向: 竖屏模式 (0°)

——我是亙古輪迴Colby，2 0 5 3 / 0 8 2 3 / 2 9 7 0 / 2 7 9 9 / 5 0 4 2 /。 2020年6月1日 (一) 11:42 (CST)

瀏覽器版本過於老舊，建議使用現代瀏覽器訪問（Chrome57就有點離譜）——From AnnAngela the Temporary Bureaucrat (Talk) 2020年6月1日 (一) 15:09 (CST)

已經說了，魅族瀏覽器這麼落後是我沒想到的。——我是亙古輪迴Colby，2 0 5 3 / 0 8 2 3 / 2 9 7 0 / 2 7 9 9 / 5 0 4 2 /。 2020年6月1日 (一) 16:34 (CST)

問題反饋：Mobileonly選擇器與「文本切換顯示按鈕」模板不兼容

@AnnAngela示例

<div class="mobileonly">
{{文本切换显示按钮|noir@off=精彩片段（素敵なセグメント）|noir@on=内容已全部展开（内容はすべて展開されました）|@default=noir|@reverse=yes}}
</div>

，這樣寫的後果是無論在手機版視圖下還是在電腦版視圖下都不會顯示按鈕。

手機版視圖下可以看到（[1]），請檢查（順便請記得簽名）。——From AnnAngela the Temporary Bureaucrat (Talk) 2020年6月3日 (三) 22:37 (CST)

謝謝，找見問題在哪裡了。如果我把帶nomobile選擇器的div放在帶mobileonly選擇器的div上，那用手機版看的結果就是什麼也沒有。——我是亙古輪迴Colby，2 0 5 3 / 0 8 2 3 / 2 9 7 0 / 2 7 9 9 / 5 0 4 2 /。 2020年6月4日 (四) 10:32 (CST)

那確實的，前者是在移動端上必定被移動端插件從伺服器直接削除。——From AnnAngela the Temporary Bureaucrat (Talk) 2020年6月4日 (四) 10:50 (CST)

但是不應該啊，我又沒有把它們套在一起，分隔開的兩個div應該互不影響才對，但實際情況就是前後順序會對顯示有影響。——我是亙古輪迴Colby，2 0 5 3 / 0 8 2 3 / 2 9 7 0 / 2 7 9 9 / 5 0 4 2 /。 2020年6月4日 (四) 21:02 (CST)

那麼能否來一段能復現問題的代碼？——From AnnAngela the Temporary Bureaucrat (Talk) 2020年6月4日 (四) 21:03 (CST)

示例——我是亙古輪迴Colby，2 0 5 3 / 0 8 2 3 / 2 9 7 0 / 2 7 9 9 / 5 0 4 2 /。 2020年6月5日 (五) 12:32 (CST)

懂了，這波啊，這波是widget和移動端插件配合的不是很好，前面nomobile里的模板引用過一次widget，然後widget以為已經加載過了，所以後面mobileonly里的模板再引用時就不會加載了，但是最後輸出成html時移動端插件把前面的nomobile直接削除，導致加載好的widget無了，後面mobileonly里的又不加載，所以出現了啥都沒有的情況。

只能說建議在最前面套個按鈕隨便寫點啥都行先把widget加載出來再說。——From AnnAngela the Temporary Bureaucrat (Talk) 2020年6月5日 (五) 21:18 (CST)

謝謝。——我是亙古輪迴Colby，2 0 5 3 / 0 8 2 3 / 2 9 7 0 / 2 7 9 9 / 5 0 4 2 /。 2020年6月5日 (五) 22:24 (CST)

能否完全改掉按鈕的原始樣式，比如用一張圖片來替換？

RT。如果不行，那也沒有類似功能的模板？--Fetton_論（✉戰雙帕彌什專題編輯組求人中...），留言於: 2020年12月10日 (四) 13:14 (CST)

你想要啥效果？——From AnnAngela the Temporary Bureaucrat (Talk) 2020年12月10日 (四) 21:03 (CST)

用其他的東西，比如一張圖片、一段文字或者自己寫的樣式來完全替代按鈕原本的樣式。--Fetton_論（✉戰雙帕彌什專題編輯組求人中...），留言於: 2020年12月10日 (四) 21:44 (CST)

補充一下，如果可以實現的話，可能還會有以下附加優點：1. 自動繁簡轉換；2. 使用MW解析器自帶的CSS sanitizer，杜絕隱患。

在未修改的現在硬要做也能做，就是曲折一點，參見{{styleToggle/switch}}和WannaCry娘。結合templatestyles的話大概會稍輕鬆一點，參見{{Oregairu top blue}}。

順便@一下可能會感興趣的大佬。——移動版用戶 Bhsd（討論） 2020年12月11日 (五) 00:46 (CST)

理論上應該可以。私用戶頁的遮罩是這麼寫的，外面套一層position: relative的元素，裡面寫上想要顯示的內容，然後用{{切換顯示按鈕樣式}}指定position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 0; margin: 0; border: none; cursor: pointer; opacity: 0;，在後面做一層「假的」按鈕這樣。--EnMGP編輯者樂然 ✉ HH新曲《水窪上的輪舞》發布！ 2020年12月11日 (五) 07:24 (CST)

應該是可以寫的，我明天早上處理一下。——From AnnAngela the Temporary Bureaucrat (Talk) 2020年12月11日 (五) 18:21 (CST)

@Fetton，Leranjun加好了。——From AnnAngela the Temporary Bureaucrat (Talk) 2020年12月13日 (日) 10:20 (CST)

第一段话：{{切换显示|啦啦啦|111}}

第二段话：{{切换显示|bla|222}}

第三段话：{{切换显示|bla|333}}

{{切换显示样式|啦啦啦=color: red; font-weight: 700;}}

{{切换显示按钮
|@default=啦啦啦
|啦啦啦=显示第一段话
|bla=[[File:Moegirl is watching you.jpg|100px]]显示第二、三段话
}}

第一段話：111

第二段話：222

第三段話：333

顯示第一段話顯示第一段話顯示第二、三段話顯示第二、三段話

 讚 安の速度Orz--EnMGP編輯者樂然 ✉ HH新曲《水窪上的輪舞》發布！ 2020年12月13日 (日) 10:35 (CST)

肥腸感謝！--Fetton_論（✉戰雙帕彌什專題編輯組求人中...），留言於: 2020年12月13日 (日) 12:48 (CST)

@AnnAngela radio的表現存在異常，現在點擊同一個選項2次會取消選擇，而且此時點擊input和點擊label的效果還不一樣。——移動版用戶 Bhsd（討論） 2020年12月13日 (日) 11:37 (CST)

前者是feature，後者已修復。——From AnnAngela the Temporary Bureaucrat (Talk) 2020年12月13日 (日) 13:19 (CST)

@AnnAngela 這個新feature會造成以前設計的{{配音表}}等模板出現問題，能否添加參數控制？——移動版用戶 Bhsd（討論） 2020年12月13日 (日) 13:37 (CST)

已回調，請按照新的DOM重新調整樣式。——From AnnAngela the Temporary Bureaucrat (Talk) 2020年12月13日 (日) 15:33 (CST)