[发明专利]一种网页滚动交互系统、方法和终端在审
| 申请号: | 201910300891.5 | 申请日: | 2019-04-15 |
| 公开(公告)号: | CN109947341A | 公开(公告)日: | 2019-06-28 |
| 发明(设计)人: | 胡贵亮 | 申请(专利权)人: | 重庆天蓬网络有限公司 |
| 主分类号: | G06F3/0485 | 分类号: | G06F3/0485;G06F3/0487 |
| 代理公司: | 北京酷爱智慧知识产权代理有限公司 11514 | 代理人: | 梁爱荣 |
| 地址: | 401135 重*** | 国省代码: | 重庆;50 |
| 权利要求书: | 查看更多 | 说明书: | 查看更多 |
| 摘要: | |||
| 搜索关键词: | 滚动 网页滚动 操作区 滚动操作 交互系统 速度设置 向下滚动 站点 网页主体内容 操作面板 触发事件 监听事件 交互终端 接收模块 控制模块 提取模块 网页设置 绑定 省时 省力 鼠标 终端 | ||
1.一种网页滚动交互系统,其特征在于,包括设置在站点网页的操作面板,所述操作面板包括四个操作区,四个所述操作区分别为百分比滚动区、滚动速度设置区、向上滚动区和向下滚动区;
所述百分比滚动区内设置有滑块,通过鼠标指针拖动滑块带动站点网页主体内容同步滚动对应的像素值;
所述滚动速度设置区设置有输入框,用于输入并保存站点网页主体内容的滚动速度;
所述向上滚动区,鼠标指针移动至所述向上滚动区带动站点网页主体内容以滚动速度设置区设置的滚动速度不断向上滚动;鼠标指针双击所述向上滚动区则带动站点网页主体内容滚动至顶部;
所述向下滚动区,鼠标指针移动至所述向下滚动区带动站点网页主体内容以滚动速度设置区设置的滚动速度不断向下滚动;鼠标指针双击所述向下滚动区则带动站点网页主体内容滚动至底部。
2.根据权利要求1所述的一种网页滚动交互系统,其特征在于,所述百分比滚动区内设置的滑块具有以下节点:10%,20%,30%,40%,50%,60%,70%,80%和90%。
3.根据权利要求2所述的一种网页滚动交互系统,其特征在于,所述滑块沿竖向滑动。
4.根据权利要求1所述的一种网页滚动交互系统,其特征在于,利用JavaScript脚本监控鼠标指针的移动,并通过JavaScript脚本计算站点网页主体内容高度,并带动站点网站主体内容进行滚动。
5.根据权利要求1所述的一种网页滚动交互系统,其特征在于,所述滚动速度设置区设置的滚动速度数值在1像素/秒~9999像素/秒。
6.根据权利要求1所述的一种网页滚动交互系统,其特征在于,所述向下滚动区的向下滚动的算法为:
设站点网页向下滚动,滚动速度为S,S的单位为px/s,保存当前滚动高度的变量h,h初始值为0,网页主体内容高度为H,通过JavaScript脚本的定时器功能每100毫秒进行一次滚动操作,每次滚动停止位置为距离内容顶部h像素值的位置,h的计算方法:
h=(S/1000*100)+h
设置站点网页的主体内容滚动的JavaScript脚本方法为:
setTimeout(function){
document.body.scrollTop=h
},100)
所述向上滚动区的向上滚动的算法为:
设站点网页向上滚动,滚动速度为S,S的单位为px/s,保存当前滚动高度的变量h,当h小于或等于0时,滚动停止位置保持到0;变量h初始值大于0时,每次滚动停止位置为距离内容顶部h像素值的位置,h的计算方法:
h=(S/1000*100*-1)+h。
7.一种网页滚动交互方法,其特征在于,包括以下步骤:
A1、在站点网页设置滚动的操作面板;
A2、在所述操作面板中添加百分比滚动区、滚动速度设置区、向上滚动区和向下滚动区四个操作区的区域元素;
A3、在百分比滚动区、滚动速度设置区、向上滚动区和向下滚动区四个操作区的区域元素分别做监听事件绑定;
A4、鼠标指针对百分比滚动区、滚动速度设置区、向上滚动区和向下滚动区四个操作区的区域元素做触发事件以使得站点网页主体内容作出不同的滚动反应。
8.根据权利要求7所述的一种网页滚动交互方法,其特征在于,步骤A1中的具体实现方法为:站点网页通过设置一个按钮或可点击区域来切换滚动的操作面板的显示和隐藏属性。
9.根据权利要求8所述的一种网页滚动交互方法,其特征在于,控制滚动的操作面板的显示和隐藏属性通过网页CSS技术设置的display属性值实现。
10.一种网页滚动交互终端,其特征在于,包括接收模块、提取模块和控制模块;其中,
所述接收模块用于接收用户的鼠标指针对站点网页内的操作面板的操作指令;
所述提取模块用于将操作指令传递至站点网页的内核中;
所述控制模块用于控制站点网页按操作指令带动站点网页进行滚动操作。
该专利技术资料仅供研究查看技术是否侵权等信息,商用须获得专利权人授权。该专利全部权利属于重庆天蓬网络有限公司,未经重庆天蓬网络有限公司许可,擅自商用是侵权行为。如果您想购买此专利、获得商业授权和技术合作,请联系【客服】
本文链接:http://www.vipzhuanli.com/pat/books/201910300891.5/1.html,转载请声明来源钻瓜专利网。
- 上一篇:一种图片加载方法、装置及终端
- 下一篇:移动终端、应用启动方法及存储介质





