网页特效栏目收集了最全最新的前端网页插件,包括最流行的jQuery,Bootstrap,Js,Css,Vue等主流特效插件。
这是一款基于jquery +Tailwind CSS框架,实现的checkbox的开/关插件。使用简单,无需任何js调用,可自定义htmldata属性。
使用方法:
1.引入最新的jQuery库和Tailwind CSS框架。
<link href="tailwind.min.css" rel="stylesheet" />
<script src="jquery.min.js"></script>
2.在jQuery库之后引入jquery-tailwind-toggle.js
<script src="jquery-tailwind-toggle.js"></script>
3. 调用方法,只需在标签上添加 data-toggle="checkbox-toggle"
<label data-toggle="checkbox-toggle">
<input type="checkbox" />
</label>
4.自定义HTML切换开关data属性:
data-rounded: rounded[-none|-sm|-lg|-full]
data-handle-size: 尺寸默认: 20
data-handle-color: 默认背景色 : 'bg-white'
data-off-color: 默认关闭背景色 : 'bg-gray-400'
data-on-color: 默认开启背景色 : 'bg-blue-400'
<label
data-toggle="checkbox-toggle"
data-rounded="rounded"
data-handle-size="20"
data-handle-color="bg-white"
data-off-color="bg-gray-400"
data-on-color="bg-blue-600">
<input type="checkbox" />
</label>
会员登陆后即可下载插件。
转载请注明来源:jQuery Tailwind复选框切换表单插件
本文永久链接地址:https://www.moyouyouw.cn/code/633.html
郑重声明:本站所有主题/文章除标明原创外,均来自网络转载,版权归原作者所有,如果有侵犯到您的权益,请联系本站删除,谢谢!我们不承担任何技术及版权问题,且不对任何资源负法律责任。
已有 位小伙伴发表了看法
欢迎 你 发表评论