买专利卖专利找龙图腾，真高效！ 查专利查商标用IPTOP,全免费！专利年费监控用IP管家,真方便！

龙图腾网恭喜浪潮软件科技有限公司申请的专利一种原生HTML轮播组件方法及装置获国家发明授权专利权，本发明授权专利权由国家知识产权局授予，授权公告号为：CN114721651B 。

龙图腾网通过国家知识产权局官网在2025-04-25发布的发明授权授权公告中获悉：该发明授权的专利申请号/专利号为：202210382494.9，技术领域涉及：G06F8/36；该发明授权一种原生HTML轮播组件方法及装置是由刘一晨;程林;杨培强设计研发完成，并于2022-04-13向国家知识产权局提交的专利申请。

本一种原生HTML轮播组件方法及装置在说明书摘要公布了：本发明涉及组件开发领域，具体提供了一种原生HTML轮播组件方法，具有如下步骤：S1、首先创建一个类并继承原生HTML元素类；S2、创建必要的DOM元素，并为元素添加样式；S3、DOM结构创建完成后，进行轮播功能实现；S4、设置点击右箭头触发展示下一个板块事件；S5、进行自动轮播；S6、利用WebcomponentsAPI创建自定义标签；S7、在页面上使用itpd‑swiper组件。与现有技术相比，本发明通过shadowDOM创建的子DOM树，不会被页面上的CSS样式和JS脚本所影响。当引入第三方组件的时候，不会对网站造成影响，对于开发者来说，插件变得更简单。

本发明授权一种原生HTML轮播组件方法及装置在权利要求书中公布了：1.一种原生HTML轮播组件方法，其特征在于，具有如下步骤：S1、首先创建一个类并继承原生HTML元素类；S2、创建必要的DOM元素，并为元素添加样式；设置初始宽度、初始高度和初始渐变时间，渐变过程曲线为二次贝塞尔曲线；DOM元素样式中，各个元素的渐变过程曲线为二次贝塞尔曲线，设置类名和当前类名包含的样式字段，布局方式为相对位置，居中布局，隐藏外部元素，设置高度占满，宽度和高度像素相同，背景色为白色，设置左箭头样式，设置箭头鼠标移动的透明度；创建style标签，将所述DOM元素样式填充至标签中，创建div元素、设置div的样式名、再次创建div元素，此为轮播板块的容器元素；设置所述容器元素的样式名称，创建圆点的容器元素，设置圆点容器元素的样式名称，创建向左箭头、向右箭头、左箭头的样式名称和右箭头的样式名称，创建阴影DOM将style元素添加到阴影DOM中，将轮播容器添加到阴影DOM中，在轮播容器中添加轮播板块列表容器；在轮播容器中添加圆点容器、向左箭头和向右箭头，设置初始展示第几个板块，设置所述轮播板块的个数默认值，设置轮播板块是否正在移动，调用init方法，进行初始化操作；调用设置容器方法，设置左箭头、右箭头和轮播板块数量，给向右的箭头添加点击事件，执行滚动到下一个板块的方法，给向左的箭头添加点击事件，判断是否正在滚动，没有滚动时候执行如下操作，调用设置当前序号下圆点样式的方法，移除当前序号下的圆点样式，将序号减一，将序号设置为最后一位；根据板块数量设置板块容器宽度，将自定义标签中的HTML字符串赋值给板块容器，复制第一个板块，将复制的板块添加到板块容器的最后一位，调用创建圆点的方法，创建圆点，将圆点容器清空，根据板块个数进行循环，创建圆点元素，设置圆点元素的样式名称，判断当前圆点是否为默认展示，如果是则给当前圆点添加展示样式；S3、DOM结构创建完成后，进行轮播功能实现；S4、设置点击右箭头触发展示下一个板块事件；S5、进行自动轮播；S6、利用WebcomponentsAPI创建自定义标签；S7、在页面上使用itpd-swiper组件。

如需购买、转让、实施、许可或投资类似专利技术，可联系本专利的申请人或专利权人浪潮软件科技有限公司，其通讯地址为：250100 山东省济南市高新区浪潮路1036号浪潮科技园；或者联系龙图腾网官方客服，联系龙图腾网可拨打电话0551-65771310或微信搜索“龙图腾网”。