[发明专利]滚动条控制方法及装置

说明书

本发明公开一种滚动条控制方法及装置；本发明实施例将浏览器原生滚动条所在的原生滚动条容器嵌套到预设的一外层容器中；监控所述原生滚动条容器的滚动事件；根据所述原生滚动条容器对应的滚动事件，操作所述外层容器中自定义滚动条的位置，使所述自定义滚动条与所述原生滚动条保持一致；具有实现自定义滚动条的同时，保留原生滚动条的事件体系和默认行为有益效果，且实现代码简单，丝毫不影响用户加载网页的速度。

技术领域

本发明涉及浏览器领域，尤其涉及一种滚动条控制方法及装置。

背景技术

对于浏览器提供的原生滚动条无法自定义样式的缺陷，目前采用的解决方式是利用网页脚本对浏览器新增自定义滚动条，以模拟原生滚动条的行为和样式。上述这种方案解决了原生滚动条无法自定义样式的缺陷，但同时破坏了原生滚动条的事件体系及一些默认行为，比如网页可以监听的滚动事件、滚动事件的冒泡及鼠标滚轮滚动、上下键触发的滚动、嵌套滚动问题等原生滚动条常用的事件行为，该自定义滚动条都可能无法提供；若使用网页脚本来完整模拟原生滚动条的所有行为，则代码开发成本很高且代码量大，而大量的代码将导致用户加载网页的速度变得十分缓慢，用户满意度低。

发明内容

鉴于此，有必要提供一种滚动条控制方法及装置，以实现自定义滚动条的同时保留原生滚动条的事件体系和默认行为。

本发明实施例公开了一种滚动条控制方法，包括以下步骤：

将浏览器原生滚动条所在的原生滚动条容器嵌套到预设的一外层容器中；

监控所述原生滚动条容器的滚动事件；

根据所述原生滚动条容器对应的滚动事件，操作所述外层容器中自定义滚动条的位置，使所述自定义滚动条与所述原生滚动条保持一致。

本发明实施例还公开了一种滚动条控制装置，包括：

设置模块，用于将浏览器原生滚动条所在的原生滚动条容器嵌套到预设的一外层容器中；

监控模块，用于监控所述原生滚动条容器的滚动事件；

控制模块，用于根据所述原生滚动条容器对应的滚动事件，操作所述外层容器中自定义滚动条的位置，使所述自定义滚动条与所述原生滚动条保持一致。

本发明实施例将浏览器原生滚动条所在的原生滚动条容器嵌套到预设的一外层容器中；监控所述原生滚动条容器的滚动事件；根据所述原生滚动条容器对应的滚动事件，操作所述外层容器中自定义滚动条的位置，使所述自定义滚动条与所述原生滚动条保持一致；具有实现自定义滚动条的同时，保留原生滚动条的事件体系和默认行为有益效果，且实现代码简单，丝毫不影响用户加载网页的速度。

附图说明

图1是本发明滚动条控制方法第一实施例流程示意图；

图2为一具体应用场景中显示的滚动条一实施例场景示意图；

图3是本发明滚动条控制方法第二实施例流程示意图；

图4是本发明滚动条控制方法第三实施例流程示意图；

图5是本发明滚动条控制方法中，根据原生滚动条操作自定义滚动条第一实施例流程示意图；

图6是本发明滚动条控制方法中，根据原生滚动条操作自定义滚动条第二实施例流程示意图；

图7是本发明滚动条控制装置一实施例功能模块示意图。

本发明实施例目的的实现、功能特点及优点将结合实施例，参照附图做进一步说明。

具体实施方式

以下结合说明书附图及具体实施例进一步说明本发明的技术方案。应当理解，此处所描述的具体实施例仅仅用以解释本发明，并不用于限定本发明。