模板:Click-switch：修订间差异
跳转到导航
跳转到搜索
ChineseDolphin（留言 | 贡献） 无编辑摘要 |
ChineseDolphin（留言 | 贡献） 小无编辑摘要 |
||
| 第1行： | 第1行： | ||
<includeonly> | |||
<div class="click-switch-container" style="display: inline-block; position: relative;"> | <div class="click-switch-container" style="display: inline-block; position: relative;"> | ||
<input type="checkbox" id="click-switch-{{{id | <!-- 添加了id必填检查 --> | ||
{{#if: {{{id|}}} | |||
| <input type="checkbox" id="click-switch-{{{id}}}" class="click-switch-checkbox" style="display: none;"> | |||
| <strong style="color:red">错误：未提供id参数!</strong> | |||
}} | |||
<label for="click-switch-{{{id|}}}" style="cursor: pointer;"> | <label for="click-switch-{{{id|}}}" style="cursor: pointer;"> | ||
<span class="click-switch-text1">{{{text1|默认文本1}}}</span> | <span class="click-switch-text1">{{{text1|默认文本1}}}</span> | ||
<span class="click-switch-text2 | <span class="click-switch-text2">{{{text2|默认文本2}}}</span> | ||
</label> | </label> | ||
</div> | </div> | ||
<style> | |||
/* 初始状态隐藏text2 */ | |||
.click-switch-text2 { display: none; } | |||
/* 选中状态显示text2，隐藏text1 */ | |||
#click-switch-{{{id|}}}:checked ~ .click-switch-text1 { display: none; } | |||
#click-switch-{{{id|}}}:checked ~ .click-switch-text2 { display: inline; } | |||
</style> | |||
</includeonly> | |||