网页内滑动显示网页对象的方法及装置制造方法及图纸

一种网页内滑动显示网页对象的方法，包括：获取触摸事件，获取与所述触摸事件对应的网页对象；获取与所述网页对象对应的滑动事件；抽样获取所述滑动事件对应的触摸点的位置，根据所述触摸点的位置移动所述网页对象；根据所述触摸事件和所述滑动事件计算滑动位移和滑动时间；根据所述滑动位移和滑动时间滑动所述网页对象。此外，还提供了一种网页内滑动显示网页对象的装置。上述网页内滑动显示网页对象的方法和装置可以提高用户操作的便利性。

【技术实现步骤摘要】
网页内滑动显示网页对象的方法及装置
本专利技术涉及计算机
，特别是涉及一种网页内滑动显示网页对象的方法及装置。
技术介绍
随着触摸屏技术和移动终端技术的发展，智能移动设备已经成为当今市场上的主流，包括智能手机、掌上电脑、平板电脑、电子书等。用户可通过智能移动设备上自带的移动版浏览器在任何有无线网络覆盖的区域自由地浏览网页，使得人与人之间的沟通更加方便。传统技术中，用户在使用移动版浏览器上网时，可通过在触摸屏上滑动触摸来实现网页的整体滑动。网页中还包含网页对象，如图片、文本块、表单等。网页对象可在其所处的可视窗口(如由frame、div、span、input等标签定义的网页显示区域)中滑动。例如,可在网页中通过div标签定义可视窗口，设置div标签的overflow属性为auto,当该div标签中包含的网页对象的大小大于该div的可视窗口的大小时，即通过添加滚动条来显示该网页对象。用户可通过对该网页对象滑动触摸来在可视窗口中滑动显示该网页对象的全部内容。然而，传统技术中，用户在滑动触摸网页对象时，该网页对象只能跟随触摸点的移动而移动，也就是说网页对象的最大滑动距离(考虑边界不能滑的情况)与触摸点的移动距离相同。而由于可视窗口的大小有限，因此，在网页对象的大小较大时，用户需要滑动多次才能将网页对象滑到指定的位置来展示相应的内容，从而使得用户操作的便利性不足。
技术实现思路
基于此，有必要提供一种能提高用户操作的便利性的网页内滑动显示网页对象的方法。一种网页内滑动显示网页对象的方法，包括:获取触摸事件，获取与所述触摸事件对应的网页对象；获取与所述网页对象对应的滑动事件；抽样获取所述滑动事件对应的触摸点的位置，根据所述触摸点的位置移动所述网页对象；根据所述触摸事件和所述滑动事件计算滑动位移和滑动时间；根据所述滑动位移和滑动时间滑动所述网页对象。此外，还有必要提供一种能提高用户操作的便利性的网页内滑动显示网页对象的>J-U ρ?α装直。一种网页内滑动显示网页对象的装置，包括:触摸事件获取模块，用于获取触摸事件，获取与所述触摸事件对应的网页对象；滑动事件获取模块，用于获取与所述网页对象对应的滑动事件；同步滑动模块，用于抽样获取所述滑动事件对应的触摸点的位置，根据所述触摸点的位置移动所述网页对象；参数计算模块，用于根据所述触摸事件和所述滑动事件计算滑动位移和滑动时间；惯性滑动模块，用于根据所述滑动位移和滑动时间滑动所述网页对象。上述网页内滑动显示网页对象的方法和装置，先获取网页对象的触摸事件和滑动事件，并根据滑动事件对应的触摸点移动网页对象，然后在同步移动网页对象之后还根据触摸事件和滑动事件计算滑动位移和滑动时间，并根据滑动位移和滑动时间继续滑动网页对象。用户在滑动网页对象时，可使网页对象获得比滑动位移更大的移动距离，且可通过控制滑动操作的速度来控制网页对象的移动距离。与传统技术相比，用户只需滑动较少的次数即可将网页对象滑动到特定的位置，从而提高了操作的便利性。【附图说明】图1为一个实施例中网页内滑动显示网页对象的方法的流程图；图2为一个实施例中网页内滑动显示网页对象的装置的结构示意图；图3为另一个实施例中网页内滑动显示网页对象的装置的结构示意图。【具体实施方式】在一个实施例中，如图1所示，一种网页内滑动显示网页对象的方法，包括:步骤S102，获取触摸事件，获取与触摸事件对应的网页对象。触摸事件即触摸屏检测到的触摸操作时触发的事件。当用户用手指接触触摸屏表面时，即会触发触摸事件。触摸事件可与终端设备上当前运行的应用程序绑定。例如，若用户在网页上的某个图片对象所处的可视窗口内进行按压时，浏览器可根据触摸点在触摸屏上所处的位置来定位到该图片对象，并将该图片对象与该触摸事件绑定，然后抛出该触摸事件由相应的事件处理函数处理。在本实施例中，可通过脚本函数(例如，由Javascript语言定义的脚本函数)获取触摸事件，提取触摸事件中包含的网页对象标识，根据提取得到的网页对象标识获取网页对象。步骤S104，获取与网页对象对应的滑动事件。滑动事件即触摸屏检测到触摸点的位置连续变化时触发的事件。滑动事件可与终端设备上当前运行的应用程序绑定。例如，当用户在网页上的某个图片对象所处的可视窗口内滑动时，浏览器可根据触摸点的位置定位到该图片对象，并将该图片对象与该滑动事件绑定，然后抛出滑动事件由相应的事件处理函数处理。需要说明的是，在滑动过程中，若触摸点的位置移出网页对象A所处的可视窗口进入网页对象B所处的可视窗口，则网页对象A停止抛出滑动事件。而当触摸点进入网页对象B所处的可视窗口时，触发与网页对象B对应的触摸事件，当触摸点继续在网页对象B所处的可视窗口内滑动时，触发与网页对象B对应的滑动事件。在滑动过程中，若触摸点在网页对象A所处的可视窗口内离开触摸屏，则网页对象A停止抛出滑动事件。在获取到与网页对象对应的触摸事件后，若继续获取到与该网页对象对应的滑动事件，则表示用户在接触触摸屏后紧接着执行了滑动操作；若在获取到网页对象的触摸事件之后检测到该网页对象的触摸停止事件，则表示，本次输入中，用户未在触摸屏上进行滑动操作，而只是在触摸屏上进行了点击操作。例如，网页对象中可能包括链接、按钮等。用户可通过对链接进行点击操作来触发页面跳转指令。步骤S106，抽样获取滑动事件对应的触摸点的位置，根据触摸点的位置移动网页对象。在一个实施例中，滑动事件对应的触摸点的位置可通过像素坐标表示，例如，可通过top:1Opx, left: 20px表示触摸点的位置。在本实施例中，根据触摸点的位置移动网页对象的步骤可具体为:根据抽样获取的触摸点的像素坐标计算触摸点位置变化的像素增量，根据该像素增量设置网页对象的位置。例如，若抽样获取的触摸点的像素坐标的变化增量为top: 2px,则可在网页对象的CSS (Cascading Style Sheet,层叠样式表,用于定义网页对象的样式)属性中将top属性值增加2px。浏览器中设置有CSS属性修改监听器，当网页对象的top属性改变时，自动在可视窗口中根据更新后的top属性调整网页对象的位置。由于抽样时间较短，因此整体上就展现出网页对象跟随触摸点同步移动的效果。步骤S108，根据触摸事件和滑动事件计算滑动位移和滑动时间。滑动位移即触摸点在网页对象所处的可视窗口内滑动的位移。滑动时间即由触摸事件被触发开始，到滑动事件结束的时间长度。在一个实施例中，根据触摸事件和滑动事件计算滑动位移和滑动时间的步骤为:获取触摸事件对应的起始触摸点的位置以及起始触摸点对应的时间戳，获取滑动事件对应的终止触摸点的位置以及终止触摸点对应的时间戳，根据起始触摸点和终止触摸点的位置计算滑动位移，根据起始触摸点和终止触摸点对应的时间戳计算滑动时间。起始触摸点即网页对象的可视窗口内触发触摸事件时对应的触摸点。终止触摸点即为滑动操作在离开网页对象的可视窗口时的触摸点。终止触摸点可以是滑出可视窗口时的触摸点，也可以是在可视窗口内离开触摸屏时的触摸点。起始触摸点和终止触摸点的位置可通过像素坐标表示。滑动位移可通过水平和垂直方向上的像素坐标表示。例如，滑动位移可表示为top:-10px, left:5px,即意味着水平方向向右(相本文档来自技高网...

【技术保护点】
一种网页内滑动显示网页对象的方法，包括：获取触摸事件，获取与所述触摸事件对应的网页对象；获取与所述网页对象对应的滑动事件；抽样获取所述滑动事件对应的触摸点的位置，根据所述触摸点的位置移动所述网页对象；根据所述触摸事件和所述滑动事件计算滑动位移和滑动时间；根据所述滑动位移和滑动时间滑动所述网页对象。

【技术特征摘要】
1.一种网页内滑动显示网页对象的方法,包括: 获取触摸事件，获取与所述触摸事件对应的网页对象； 获取与所述网页对象对应的滑动事件； 抽样获取所述滑动事件对应的触摸点的位置，根据所述触摸点的位置移动所述网页对象； 根据所述触摸事件和所述滑动事件计算滑动位移和滑动时间； 根据所述滑动位移和滑动时间滑动所述网页对象。2.根据权利要求1所述的网页内滑动显示网页对象的方法，其特征在于，所述根据所述触摸事件和所述滑动事件计算滑动位移和滑动时间的步骤为: 获取所述触摸事件对应的起始触摸点的位置以及起始触摸点对应的时间戳； 获取所述滑动事件对应的终止触摸点的位置以及终止触摸点对应的时间戳； 根据所述起始触摸点和终止触摸点的位置计算所述滑动位移，根据所述起始触摸点和终止触摸点对应的时间戳计算所述滑动时间。3.根据权利要求1所述的网页内滑动显示网页对象的方法，其特征在于，所述根据所述滑动位移和滑动时间滑动所述网页对象的步骤为: 根据所述滑动位移和滑动时间计算滑动系数； 根据所述滑动位移和所述滑动系数计算所述网页对象的期望位移； 根据所述期望位移滑动所述网页对象。4.根据权利要求3所述的网页内滑动显示网页对象的方法，其特征在于，所述根据所述期望位移滑动所述网页对象的步骤为: 获取所述期望位移对应的预设的阈值区间； 获取所述阈值区间对应的延时参数； 根据所述期望位移和所述延时参数通过调用内置浏览器函数滑动所述网页对象。5.根据权利要求3所述的网页内滑动显示网页对象的方法，其特征在于，所述方法还包括: 获取所述网页对象对应的可视窗口； 所述根据期望位移滑动网页对象的步骤之前还包括: 获取所述网页对象的位置； 根据所述期望位移获取对应的可视窗口的边界位置； 判断所述可视窗口的边界位置与所述网页对象的位置之差是否小于或等于所述期望位移，若是，则根据所述网页对象的位置和所述可视窗口的边界位置更新期望位移。6.根据权利要求5所述的网页内滑动显示网页对象的方法，其特征在于，所述可视窗口还包括内嵌或外延的边界缓冲区； 所述根据所述触摸点的位置移动所述网页对象的步骤为: 获取所述网页对象的位置； 判断所述网页对象的位置是否超出所述可视窗口或者所述边界缓冲区的边缘，若是，则停止移动所述网页对象；否则，继续执行所述根据所述触摸点的位置移动所述网页对象的步骤。7.根据权利要求6所述的网页内滑动显示网页对象的方法，其特征在于，所述根据所述触摸点的位置移动所述网页对象的步骤之后还包括: 获取所述网页对象的位置； 判断所述网页对象的位置是否位于所述边...

【专利技术属性】
技术研发人员：刘明军，
申请(专利权)人：腾讯科技深圳有限公司，
类型：发明
国别省市：