注意 头部 和 底部 不要使用fs、mt、lh、lm...快捷样式，因为改动不大，自行定义 字体响应式：fs fs16 等同于 font-size="16px" 区间：12-100 依次递增12、13、14、15... 复制 padding响应式：pt 、pb pt100 等同于 padding-top="100px" 区间：10-200 以10递增10、20、30、40... 复制 pb100 等同于 padding-bottom="100px" 区间：10-200 以10递增10、20、30、40...…

一款类似于 wow.js 随滚动轴的浮动动画，但是它不依赖于任何插件： 文件已经更新到模板中，可直接使用 // 初始化 window.sr = new ScrollReveal({distance: '160px',duration: 1000,easing: 'ease-out',viewFactor: 0.2,mobile: false}); // 指定元素使用 sr.reveal('.title', {delay: 100,interval: 300}); sr.reveal('.menu', {delay:…

注意：之前的数字滚动需要添加js，且不支持单页面多个数字滚动 最新模板已经集成进去，直接使用（可支持带小数）： <div class="number" speed="3000" loop> <ul> <li><span class="timer">1000</span>+</li> <li><span class="timer">500</span>+</li> <li><spa…

防止切换的时候抖动、留有空白，所以需要使用js来实现： <div class="listBox"> <ul class="flex"> <!-- 默认第一个添加active --> <li class="active"><img src="" alt=""></li> <li><img src="" alt=""></li> <li><img src="" alt=""></li…

适用范围：选中会自动居中显示 年份切换、tab切换 <div class="thumbs"> <div class="swiper-container swiper-no-swiping"> <div class="swiper-wrapper"> <div class="swiper-slide"><a href="javascript:void(0);" class="thumbs-year">2021</a></div> .…

适用于：点击菜单按钮切换内容是swiper的情况下，支持 焦点切换、左右按钮切换、自动轮播 <div class="flex swiperMenu"> <a href="javascript:void(0);" class="active">菜单一</a> <a href="javascript:void(0);">菜单二</a> <a href="javascript:void(0);">菜单三</a> </div> …

传统默认的select下拉。且不说丑不丑的问题，最让人头大的地方还是不能修改option的样式，很不灵活（option高度不能修改、选中颜色不能变化....） 自定义select【模板已经封装表单】：选中其中内标签添加active，支持单页面多个下拉 添加 hasInput 则可以变成可输入下拉： See the Pen 自定义select by taoao (@taoao) on CodePen.

Jquery内容展开收起 其中内容区域的样式和按钮自行定样式，只需要添加两个class 文本内容区域class: updownText，按钮class: updownBtn  See the Pen Jq展开收缩 by taoao (@taoao) on CodePen.

图片弹窗点击放大效果 不需要额外图片、不需要引入CSS，直接引用JS，就可以使用 <a href="./images/..." class="spotlight"></a> 主题变成白色： <a href="./images/..." class="spotlight" data-theme="white"></a> 复制 <script src="./js/spotlight.bundle.js"></script> 复制 源码：直接下载

视频弹窗，可兼容本地视频和外链视频 最新模板：（不需要添加其余盒子和JS） <i class="toLink videoPlay" videoSrc="">播放</i> 测试链接：videoSrc="https://js.szmynet.net/demo.mp4" 复制 非最新模板如下： <i class="toLink videoPlay" videoSrc="">播放</i> 测试链接：videoSrc="https://js.szmynet.net/demo.m…