README.zh_CN.md

H-Widget v1.0.0

一个基于原生JavaScript开发的组件库，包含：轮播、标签页、下拉框、对话框等组件

README.md

• en English
• zh_CN 简体中文

项目在线演示

项目在线演示地址：

• GitHub Pages 部署地址：http://widget.huanghanlian.com/

项目介绍

背景： 随着现在各种框架的兴起，我们很少去思考用原生JS是如何工作的，了解原生JS也非常重要～

---

如何使用

滑动条-原生js封装

简介：进度及范围控制，支持手势操作，支持移动端+PC 演示

new range("selector",options,callback(api));

滚动条-原生js封装

简介：模拟滚动条，支持手势操作，支持移动端+PC 演示

new scrollbar("selector",options,callback(api));

日历-原生js封装

简介：日期及日期范围选择，灵活的日期选择功能 演示

new calendar("selector",options);

无缝轮播图-原生js封装

简介：无缝滚动、响应式、参数可调控等等 演示

new bannerha(selector,{options});

Tab面板-原生js封装

简介：Tab面板、响应式、参数可调控等等 演示

new tabpanel(selector,{options});

无缝向上滚动-原生js封装

简介：无缝滚动、间隔滚动、响应式、参数可调控等等 演示

new scrollup(selector,{options});

放大镜-原生js封装

简介：电商放大镜封装、参数可调控等等 演示

new magnifier(selector,{options});

倒计时-原生js封装

简介：倒计时、参数可调控等等 演示

new countdown(selector,{options});

下拉框-原生js封装

简介：下拉框、支持键盘事件、参数可调控等等 演示

new select(selector,{options});

标签页-tabs-原生js封装

简介：简易标签切换及淡入淡出幻灯片功能 演示

new tabs(selector,{options});

图片聚焦-imagezoom-原生js封装

简介：图片居中及缩放处理 演示

new imagezoom(selector,{options});

弹出框-dialog-原生js封装

简介：个性弹出层，自定义弹出位置，巧妙的定位方式 演示

new dialog(selector,{options});

城市三级联动 - citys-原生js封装

简介：最新最全的城市区划数据，自定义事件处理方式 演示

new citys("selector",options,callback(api));

格式化输入框-inputFormat-原生js封装

简介：格式化输入，方便验证 演示

new inputFormat("selector",options,callback(api));

许可证

Apache License 2.0

MIT License

Copyright (c) 2024 Jipeng Huang