CN111414106A - 一种标题显示方法、装置、电子设备及计算机可读介质 - Google Patents

Abstract

本公开实施例公开了一种标题显示方法、装置、电子设备及存储介质，其中，该方法包括：获取标题在页面中的位置区域；判断所述标题在所述页面中的位置区域是否超出了屏幕；若是，将所述标题固定在所述屏幕的预设位置。本公开实施例提供的技术方案可以在页面滚动过程中不影响标题的浏览，避免来回滚动页面查看标题的情况，方便用户，提高用户的浏览效率。

Description

一种标题显示方法、装置、电子设备及计算机可读介质

技术领域

本公开实施例涉及计算机技术，尤其涉及一种标题显示方法、装置、电子设备及计算机可读介质。

背景技术

随着智能手机、平板电脑等电子设备的普及，用户经常采用电子设备上的小程序或者应用程序浏览页面内容以获取信息。

当用户采用电子设备上的小程序或者应用程序浏览列表、文档等页面内容时，如果列表项较多或者文档内容较多时，当用户想要查看标题时，需要滑动页面返回至标题所在的位置才能查看标题，在此情况下，查看标题非常不便，也影响了用户的浏览效率。

发明内容

本公开实施例提供了一种标题显示方法、装置、电子设备及存储介质，可以页面滚动过程中不影响标题的浏览，避免来回滚动页面查看标题的情况，方便用户，提高用户的浏览效率。

第一方面，本公开实施例提供了一种标题显示方法，包括：

获取标题在页面中的位置区域；

判断所述标题在所述页面中的位置区域是否超出了屏幕；

若是，将所述标题固定在所述屏幕的预设位置。

第二方面，本公开实施例提供了一种标题显示装置，包括：

位置获取模块，用于获取标题在页面中的位置区域；

判断模块，用于判断所述标题在所述页面中的位置区域是否超出了屏幕；

固定模块，用于若是，将所述标题固定在所述屏幕的预设位置。

第三方面，本公开实施例提供了一种电子设备，包括：

一个或多个处理器；

存储装置，用于存储一个或多个程序，

当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现发明实施例提供的一种标题显示方法。

第四方面，本公开实施例提供了一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现本公开实施例提供的一种标题显示方法。

本公开实施例提供的技术方案，通过判断标题在页面中的位置区域是否超出了屏幕，当超出屏幕时，通过将标题固定在屏幕的预设位置，可以在页面滚动过程中不影响标题的浏览，避免来回滚动页面查看标题的情况，方便用户，提高用户的浏览效率。

附图说明

图1是本发明实施例提供的一种标题显示方法流程图；

图2是本发明实施例提供的一种标题显示方法流程图；

图3a是本发明实施例提供的一种标题显示方法流程图；

图3b是本发明实施例提供的一种标题显示方法流程图；

图4是本发明实施例提供的一种标题显示装置结构框图；

图5是本发明实施例提供的一种电子设备结构示意图。

具体实施方式

下面结合附图和实施例对本公开作进一步的详细说明。可以理解的是，此处所描述的具体实施例仅仅用于解释本公开，而非对本公开的限定。另外还需要说明的是，为了便于描述，附图中仅示出了与本公开相关的部分而非全部结构。

图1是本公开实施例提供的一种标题显示方法流程图，所述方法可以由标题显示装置来执行，所述装置可以由软件和/或硬件来执行，所述装置可以配置在小程序中，或者所述装置可以配置在应用程序中；其中，小程序或应用程序可以配置在智能手机、平板电脑等电子设备中。可选的，本公开实施例提供的方法可以应用于用户滑动小程序页面，小程序滚动显示页面的场景中；或者本公开实施例提供的方法可以应用于用户滑动应用程序页面，应用程序滚动显示页面的场景中。

可选的，本公开实施例提供的方法应用于显示标题的场景中，可选的，本公开实施例提供的方法可以应用小程序显示标题的场景中。本公开实施例以小程序中的标题显示为例进行说明。

如图1所示，本公开实施例提供的技术方案包括：

S110：获取标题在页面中的位置区域。

在本公开实施例中，可选的，标题可以是列表标题，也可以是文章标题，可以是一级标题，或者也可以是多级标题等，或者还可以是其他形式的标题，对标题的形式并不作限定。在本公开实施例中，标题优选为列表标题。

在本公开实施例中，获取标题在页面中的位置区域的方法可以参考相关技术中的方法，或者还可以是通过获取标题容器的位置区域以确定标题在页面中的位置区域。例如，可以获取用于存放标题内容的标题容器的top属性值、bottom属性值、left属性值和right属性值，就可以确定标题在页面中的位置区域。

S120：判断所述标题在所述页面中的位置区域是否超出了屏幕。

在本公开实施例中，可以根据标题在页面中的位置区域来判断标题是否超出了屏幕。其中，是否超出了屏幕可以理解为是否超出了屏幕的显示范围。

在本公开实施例中，可选的，判断标题在页面中的位置区域是否超出屏幕的方法可以是判断标题容器是否超出了屏幕。具体的，可以通过标题容器的top属性值、bottom属性值、left属性值和right属性值判断标题容器是否超出了屏幕，从而判断标题在页面中的位置区域是否超出了屏幕。具体的，当标题容器的top属性值、bottom属性值、left属性值和right属性值中的任何一个属性值小于零时，判断标题容器超出了屏幕，从而可以判断标题在页面中的位置区域超出了屏幕。其中，top属性值、bottom属性值、left属性值和right属性值分别是用于表征标题容器到屏幕的上边、下边、左边以及右边的距离。当标题容器的top属性值小于零时，表明标题容器距离屏幕的上边的距离是一个负值，则表明标题容器有部分或者全部超出了屏幕。

需要说明的是，判断标题在页面中的位置区域是否超出屏幕的方法并不局限于上述的方法，还可以参考相关技术中的判断方法。

S130：若是，将所述标题固定在所述屏幕的预设位置。

在本公开实施例中，当标题在页面中的位置区域超出了屏幕时，将标题固定在屏幕的预设位置，可以在滚动页面的过程中，标题一直显示在屏幕上，使用户可以始终观看到标题，在页面滚动过程中不影响标题的浏览，避免来回滚动页面查看标题的情况，方便用户，提高用户的浏览效率。当标题在页面中的位置区域没有超出屏幕时，标题可以是处于不固定的状态，可以跟随页面的滚动，并不影响用户浏览标题和标题对应的正文内容或者列表内容等。

本公开实施例提供的技术方案，通过判断标题在页面中的位置是否超出了屏幕，当超出屏幕时，通过将标题固定在屏幕的预设位置，可以在页面滚动过程中不影响标题的浏览，避免来回滚动页面查看标题的情况，方便用户，提高用户的浏览效率。

图2是本公开实施例提供的一种标题显示方法流程图，本实施例中，本实施例中的方案可以与上述实施例中的一个或者多个可选方案组合。在本公开实施例中，可选的，标题可以是列表标题。

可选的，本公开实施例提供的方法还可以包括：若所述标题在所述页面中的位置没有超出所述屏幕，将所述标题设置为非固定状态。

如图2所示，本公开实施例提供的技术方案，包括：

S210：获取列表标题在页面中的位置区域。

S220：判断所述列表标题在所述页面中的位置区域是否超出了屏幕。

若是，执行S230，若否，执行S240。

S230：将所述列表标题固定在所述屏幕的预设位置。

S240：将所述列表标题设置为非固定状态。

在本公开实施例中，S210-S230的介绍可以参考上述实施例的介绍，上述实施例中标题显示方法适用于列表标题。

在本公开实施例中，当列表标题在页面中的位置区域没有超出屏幕时，列表标题可以是处于不固定的状态，列表标题可以处于列表中的原来的位置。当页面没有滚动时，列表标题显示在列表的原来位置，以供用户进行浏览；当页面滚动时，列表标题可以跟随页面滚动显示，但是列表标题仅仅是在屏幕内滚动显示，不影响用户浏览标题和标题对应的列表内容，提高用户体验，方便用户浏览。

其中，列表标题在页面中的位置区域没有超过屏幕包括两种情况，一种是列表标题在页面中的位置区域始终没有超过屏幕，另外一种情况是列表标题在页面中的位置区域由超出屏幕到恢复到没有超出屏幕的情况，在该情况下，将标题设置为不固定的状态，可以使标题恢复到列表中的原来位置，以便于用户进行浏览。由此，通过当列表标题在页面中的位置区域没有超出屏幕时，将标题设置为处于不固定的状态，可以使列表标题自动恢复到原来的位置，便于用户将列表标题与列表内容进行对应，方便用户。

图3a是本公开实施例提供的一种标题显示方法流程图，本实施例中，本实施例中的方案可以与上述实施例中的一个或者多个可选方案组合。本实施例中，可选的，可以通过回调函数执行本发明实施例提供的方法，其中，回调函数可以是onPageScroll回调函数。

本实施例中，可选的，所述获取标题在页面中的位置区域，包括：

通过创建节点查询选择器获取目标节点对象，并获取所述目标节点对象中用于存放标题内容的标题容器的top属性值、bottom属性值、left属性值和right属性值；其中，所述目标节点对象中包含容器标签，所述容器标签作为所述标题容器，所述容器标签中包含标题容器的top属性值、bottom属性值、left属性值和right属性值；

相应的，判断所述标题在所述页面中的位置区域是否超出了所述屏幕，包括：基于所述标题容器的top属性值、bottom属性值、left属性值和right属性值判断所述标题容器是否超出屏幕。

本公开实施例中，可选的，所述目标节点对象中还包含目标变量；所述目标变量的top属性值、bottom属性值、left属性值和right属性值分别作为所述标题容器的top属性值、bottom属性值、left属性值和right属性值；

所述将所述标题固定在所述屏幕的预设位置，包括：

判断目标变量的位置属性值是否为固定的，

若否，将所述目标变量的位置属性值修改为固定的；

基于目标变量的top属性值、bottom属性值、left属性值和right属性值将所述标题容器进行固定。

本公开实施例中，可选的，所述节点对象中还包含目标变量；所述目标变量的位置属性值作为所述标题容器的位置属性值；

所述若所述标题在所述页面中的位置没有超出所述屏幕，将所述标题设置为非固定状态，包括：

若所述标题容器没有超出所述屏幕，判断目标变量的位置属性值是否为相对的；

若否，将所述目标变量的位置属性值修改为相对的。

如图3a所示，本公开实施例提供的技术方案包括：

S310：通过创建节点查询选择器获取目标节点对象，并获取所述目标节点对象中用于存放标题内容的标题容器的top属性值、bottom属性值、left属性值和right属性值；其中，所述目标节点对象中包含容器标签和目标变量，所述容器标签作为所述标题容器，所述容器标签中包含标题容器的top属性值、bottom属性值、left属性值和right属性值。

在本公开实施例中，在S310之前，需要初始化标题元素。具体过程可以是：

步骤一：创建一个<view>标签，作为标题元素的容器，设置其id属性为fixed-title。其中，id属性可以是该标签的一个标识。

步骤二：创建一个变量，可以作为目标变量，该变量的postion属性值为relative，变量的left属性值为0，变量的top属性值为0，变量的bottom属性值为0，变量的right属性值为0。

步骤三：在包含标题元素的容器的标签中，创建一个<view>标签，作为标题文字的容器，设置标题文字的容器的位置属性值为目标变量的postion属性值，设置标题文字的容器的left属性值为目标变量的left属性值，设置其bottom属性值为目标变量的bottom属性值，设置其right属性值为目标变量right属性值，设置其top属性值为目标变量top属性值。

步骤四，设置小程序页面的onPageScroll回调函数，在该回调函数中，本发明实施例提供的方法。

在本公开实施例中，标题容器可以是标题元素的容器，或者也可以是标题文字的容器。本公开实施例可以通过创建节点查询选择器获取目标节点对象，具体可以是：通过小程序createSelectorQuery()获得SelectorQuery对象实例，再调用SelectorQuery对象实例select方法，可以返回id属性为“fixed-title”的目标节点对象，其中，目标节点对象包含上述的标题元素的标签以及上述的目标变量。因此，目标节点对象中包含用于存放标题内容的标题容器的top属性值、bottom属性值、left属性值和right属性值。其中，标题容器可以是上述的标题元素的容器，或者可以是标题文字的容器。

S320：基于所述标题容器的top属性值、bottom属性值、left属性值和right属性值判断所述标题容器是否超出屏幕。

若是，执行S330，若否，执行S360。

在本公开实施例的一个实施方式中，可选的，所述基于所述标题容器的top属性值、bottom属性值、left属性值和right属性值判断所述标题容器是否超出屏幕，包括：当所述标题容器的top属性值、bottom属性值、left属性值和right属性值中任何一个属性值小于零时，判断所述标题容器超出屏幕；当所述标题容器的top属性值、bottom属性值、left属性值和right属性值均不小于零时，判断所述标题容器没有超出屏幕。

其中，top属性值、bottom属性值、left属性值和right属性值分别是用于表征标题容器到屏幕的上边、下边、左边以及右边的距离。当标题容器的top属性值小于零时，表明标题容器距离屏幕的上边的距离是一个负值，则表明标题容器有部分超出了屏幕。当标题容器的bottom属性值、left属性值和right属性值中的任何一个属性值小于零时，判断标题容器超出屏幕的方法与上述top属性值小于零时的方法相同。

S330：判断目标节点对象中的目标变量的位置属性值是否为固定的；其中，目标变量的位置属性值作为标题容器的位置属性值。

在本公开实施例中，判断目标变量的位置属性值是否为固定的，即判断目标变量的position属性值是否为fixed。

S340：若否，将目标变量的位置属性值修改为固定的。

在本公开实施例中，将目标变量的属性值修改为固定的，即为将目标变量的position属性值修改为fixed。由于position的属性值作为标题容器的位置属性值，当将目标变量的position的属性值修改为固定的时，标题容器的位置属性值为固定的。position属性值是对于元素位置设置的属性，当设置为fixed时，显示窗口不会随着页面的滚动而位置发生变化。因此，当将目标变量的position属性值修改为fixed时，标题容器不会随着页面的滚动而发生变化，会固定在屏幕上，从而完成将标题固定在屏幕上的预设位置。

S350：基于目标变量的top属性值、bottom属性值、left属性值和right属性值将所述标题容器进行固定；其中，所述目标变量的top属性值、bottom属性值、left属性值和right属性值分别作为所述标题容器的top属性值、bottom属性值、left属性值和right属性值。

在本发明实施例中，由于目标变量的top属性值、bottom属性值、left属性值和right属性值分别作为标题容器的top属性值、bottom属性值、left属性值和right属性值，可以根据需要设置目标变量的top属性值、bottom属性值、left属性值和right属性值，从而设定标题容器在屏幕中的位置，根据设定的位置，重新渲染标题，标题会按照根据设定固定的屏幕的预设位置上，可以在页面滚动过程中不影响标题的浏览，避免来回滚动页面查看标题的情况，方便用户，提高用户的浏览效率。其中，当渲染列表时，小程序在组件上使用wx:for控制属性绑定一个数组，即可使用数组中各项的数据重复渲染该组件，默认数组的当前项的下标变量名默认为index，数组当前项的变量名默认item。

S360：若所述标题容器没有超出所述屏幕，判断目标变量的位置属性值是否为相对的。

在本公开实施例中，若标题容器没有超出所述屏幕，判断目标变量的位置属性值是否是相对的，即为判断目标变量的position属性值是否是relative。

S370：若否，将所述目标变量的位置属性值修改为相对的；其中，所述目标变量的位置属性值作为标题容器的位置属性值。

在本发明实施例中，若目标的位置属性值不是相对的，将目标变量的位置属性值修改为相对的，即为若目标变量的position属性值不是relative，将目标变量的position属性值修改为relative。由于position的属性值作为标题容器的位置属性值，当将目标变量的position的属性值修改为相对的时，标题容器的位置属性值为相对的。其中，position属性值是对于元素位置设置的属性，当设置为relative时，可以根据元素最初的位置进行定位，不受父级定位的影响。因此，当将目标变量的position属性值修改为relative时，标题容器的位置属性值也为relative，标题容器不会固定在屏幕上，会返回到原来的位置中。然后，小程序可以根据目标变量的top属性值、bottom属性值、left属性值和right属性值，重新渲染标题，标题在原来的位置显示在屏幕中，实现标题的自动恢复，可以使列表标题自动恢复到原来的位置，便于用户将列表标题与列表内容进行对应，方便用户。

其中，本发明实施例提供的方法还可以参考图3b所示的方法。具体的过程可以是：

S01：初始化标题元素。

步骤一：创建一个<view>标签，作为标题元素的容器，设置其id属性为fixed-title。其中，id属性可以是该标签的一个标识。

步骤二：创建一个变量，可以作为目标变量，该变量的postion属性值为relative，变量的left属性值为0，变量的top属性值为0，变量的bottom属性值为0，变量的right属性值为0。

步骤三：在包含标题元素的容器的标签中，创建一个<view>标签，作为标题文字的容器，设置标题文字的容器的位置属性值为目标变量的postion属性值，设置标题文字的容器的left属性值为目标变量的left属性值，设置其bottom属性值为目标变量的bottom属性值，设置其right属性值为目标变量right属性值，设置其top属性值为目标变量top属性值。

步骤四，设置小程序页面的onPageScroll回调函数，在该回调函数中，本发明实施例提供的方法。

S02：页面滚动时，自动固定和恢复标题位置

本步骤的主要思路是，判断标题是否超出屏幕，如果超出，则固定，如果标题在屏幕内，则处于不固定的状态。

步骤一：通过小程序createSelectorQuery()获得SelectorQuery对象实例，再调用SelectorQuery对象实例的select方法，传入#fixed-title，它就会返回id属性为'fixed-title'的目标节点对象，对应上一步的设置的标题元素的容器的id；判断该对象的top属性值、left属性值、bottom属性值、right属性值的任何一项是否小于零，如果有任何一项小于零，表明标题文字的容器有部分超出了屏幕视口，则进行下面的步骤二的标题固定的操作。如果所有项都大于零，则说明标题元素的容器在屏幕视口内，则进行下面的步骤三的自动恢复标题位置的操作。

其中，返回目标节点对象的过程可以是：

createSelectorQuery()

返回一个SelectorQuery对象实例。

返回值

SelectorQuery

其中，针对SelectorQuery.select(string selector)(SelectorQuery对象实例的选择方法)：

在当前页面下选择第一个匹配选择器selector的节点，返回一个NodesRef对象实例，可以用于获取节点信息。

其中，string selector选择器，返回值NodesRef

其中，selector类似于CSS的选择器，但仅支持下列语法：

ID选择器：#the-id，

class选择器(可以连续指定多个)：a-class.another-class

子元素选择器：the-parent>.the-child

后代选择器：the-ancestor.the-descendant

跨自定义组件的后代选择器：.the-ancestor>>>.the-descendant

多选择器的并集：#a-node,.some-other-nodes。

其中，NodesRef.boundingClientRect(function callback)：

添加节点的布局位置的查询请求。相对于显示区域，以像素为单位。其功能类似于DOM的getBoundingClientRect。返回NodesRef对应的SelectorQuery。

如果提供了callback回调函数，在执行selectQuery.exec方法后，节点信息会在callback中返回。其中，参数可以参考表1。

表1

属性	类型	说明
			id	string	节点的ID
dataset	Object	节点的dataset
			left	number	节点的左边界坐标
right	number	节点的右边界坐标
			top	number	节点的上边界坐标
bottom	number	节点的下边界坐标
			width	number	节点的宽度
height	number	节点的高度

其中，上述的节点可以理解为节点对象。

步骤二、判断目标变量的position属性值是否为fixed，如果不是则设置目标变量position属性值为fixed，这样标题文字的容器，就会固定在屏幕上，可以用设置目标变量left属性值、top属性值、right属性值、bottom属性值，来指定其距离屏幕左边、上边、右边、下边的距离，从而规定其在屏幕的位置。随后，小程序会根据目标变量left属性值、top属性值、right属性值、bottom属性值，重新渲染标题元素，随后标题会按照之前的说法固定在屏幕的某个位置上。

步骤三：判断目标变量的position属性值是否为relative，如果不是则设置目标变量的position属性值为relative，这样标题文字的容器，就不会固定在屏幕上，回到其以前的位置中。随后小程序会根据变量的值，重新渲染标题元素，随后标题会按照之前的说法回到以前的位置中。

对上述的过程中需要进行说明的是：

事件对象

如无特殊说明，当组件触发事件时，逻辑层绑定该事件的处理函数会收到一个事件对象。

BaseEvent基础事件对象属性列表如表2：

表2

属性	类型	说明
			type	String	事件类型
timeStamp	Integer	事件生成时的时间戳
			target	Object	触发事件的组件的一些属性值集合
currentTarget	Object	当前组件的一些属性值集合

CustomEvent自定义事件对象属性列表如表3(继承BaseEvent)：

表3

属性	类型	说明
			detail	Object	额外的信息

TouchEvent触摸事件对象属性列表如表4(继承BaseEvent)：

表4

属性	类型	说明
			touches	Array	触摸事件，当前停留在屏幕中的触摸点信息的数组
changedTouches	Array	触摸事件，当前变化的触摸点信息的数组

特殊事件：<canvas/>中的触摸事件不可冒泡，所以没有currentTarget。其中，touches是一个数组，每个元素为一个Touch对象(canvas触摸事件中携带的touches是CanvasTouch数组)。表示当前停留在屏幕上的触摸点。

Touch对象的信息如表5所示。

表5

其中，changedTouches数据格式同touches。表示有变化的触摸点，如从无变有(touchstart)，位置变化(touchmove)，从有变无(touchend、touchcancel)。

图4是本公开实施例提供的一种标题显示装置结构框图，如图4所示，本发明实施例提供的装置包括位置获取模块410、判断模块420和固定模块430。

位置获取模块410，用于获取标题在页面中的位置区域；

判断模块420，用于判断所述标题在所述页面中的位置区域是否超出了屏幕；

固定模块430，用于若是，将所述标题固定在所述屏幕的预设位置。

可选的，所述装置设置模块，用于若所述标题在所述页面中的位置没有超出所述屏幕，将所述标题设置为非固定状态。

可选的，位置获取模块410，用于获取用于存放标题内容的标题容器的top属性值、bottom属性值、left属性值和right属性值；

相应的，判断模块420，用于基于所述标题容器的top属性值、bottom属性值、left属性值和right属性值判断所述标题容器是否超出屏幕。

可选的，位置获取模块410，用于通过创建节点查询选择器获取目标节点对象，并获取所述目标节点对象中用于存放标题内容的标题容器的top属性值、bottom属性值、left属性值和right属性值；

其中，所述目标节点对象中包含容器标签，所述容器标签作为所述标题容器，所述容器标签中包含标题容器的top属性值、bottom属性值、left属性值和right属性值。

可选的，所述基于所述标题容器的top属性值、bottom属性值、left属性值和right属性值判断所述标题容器是否超出屏幕，包括：

若所述标题容器的top属性值、bottom属性值、left属性值和right属性值中任何一个属性值小于零，判断所述标题容器超出屏幕；

若所述标题容器的top属性值、bottom属性值、left属性值和right属性值均不小于零，判断所述标题容器没有超出屏幕。

可选的，所述目标节点对象中还包含目标变量；所述目标变量的top属性值、bottom属性值、left属性值和right属性值分别作为所述标题容器的top属性值、bottom属性值、left属性值和right属性值；

固定模块430，用于：

判断目标变量的位置属性值是否为固定的，

若否，将所述目标变量的位置属性值修改为固定的；

基于目标变量的top属性值、bottom属性值、left属性值和right属性值将所述标题容器进行固定。

可选的，所述节点对象中还包含目标变量；所述目标变量的位置属性值作为所述标题容器的位置属性值；

设置模块，用于若所述标题容器没有超出所述屏幕，判断目标变量的位置属性值是否为相对的；

若否，将所述目标变量的位置属性值修改为相对的。

上述装置可执行本公开任意实施例所提供的方法，具备执行方法相应的功能模块和有益效果。

下面参考图5，其示出了适于用来实现本公开实施例的电子设备(例如终端设备)400的结构示意图。本公开实施例中的终端设备可以包括但不限于诸如移动电话、笔记本电脑、数字广播接收器、PDA(个人数字助理)、PAD(平板电脑)、PMP(便携式多媒体播放器)、车载终端(例如车载导航终端)等等的移动终端以及诸如数字TV、台式计算机等等的固定终端。图5示出的电子设备仅仅是一个示例，不应对本公开实施例的功能和使用范围带来任何限制。

如图5所示，电子设备400可以包括处理装置(例如中央处理器、图形处理器等)401，其可以根据存储在只读存储器(ROM)402中的程序或者从存储装置408加载到随机访问存储器(RAM)403中的程序而执行各种适当的动作和处理。在RAM 403中，还存储有电子设备400操作所需的各种程序和数据。处理装置401、ROM 402以及RAM 403通过总线404彼此相连。输入/输出(I/O)接口405也连接至总线404。

通常，以下装置可以连接至I/O接口405：包括例如触摸屏、触摸板、键盘、鼠标、摄像头、麦克风、加速度计、陀螺仪等的输入装置406；包括例如液晶显示器(LCD)、扬声器、振动器等的输出装置407；包括例如磁带、硬盘等的存储装置408；以及通信装置409。通信装置409可以允许电子设备400与其他设备进行无线或有线通信以交换数据。虽然图5示出了具有各种装置的电子设备400，但是应理解的是，并不要求实施或具备所有示出的装置。可以替代地实施或具备更多或更少的装置。

特别地，根据本公开的实施例，上文参考流程图描述的过程可以被实现为计算机软件程序。例如，本公开的实施例包括一种计算机程序产品，其包括承载在计算机可读介质上的计算机程序，该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中，该计算机程序可以通过通信装置409从网络上被下载和安装，或者从存储装置408被安装，或者从ROM 402被安装。在该计算机程序被处理装置401执行时，执行本公开实施例的方法中限定的上述功能。

需要说明的是，本公开上述的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的***、装置或器件，或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于：具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。

在本公开中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行***、装置或者器件使用或者与其结合使用。而在本公开中，计算机可读信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读信号介质可以发送、传播或者传输用于由指令执行***、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于：电线、光缆、RF(射频)等等，或者上述的任意合适的组合。

上述计算机可读介质可以是上述电子设备中所包含的；也可以是单独存在，而未装配入该电子设备中。

上述计算机可读介质承载有一个或者多个程序，当上述一个或者多个程序被该电子设备执行时，使得该电子设备：

获取标题在页面中的位置区域；

判断所述标题在所述页面中的位置区域是否超出了屏幕；

若是，将所述标题固定在所述屏幕的预设位置。

可以以一种或多种程序设计语言或其组合来编写用于执行本公开的操作的计算机程序代码，上述程序设计语言包括面向对象的程序设计语言—诸如Java、Smalltalk、C++，还包括常规的过程式程序设计语言—诸如“C”语言或类似的程序设计语言。程序代码可以完全地在用户计算机上执行、部分地在用户计算机上执行、作为一个独立的软件包执行、部分在用户计算机上部分在远程计算机上执行、或者完全在远程计算机或服务器上执行。在涉及远程计算机的情形中，远程计算机可以通过任意种类的网络——包括局域网(LAN)或广域网(WAN)—连接到用户计算机，或者，可以连接到外部计算机(例如利用因特网服务提供商来通过因特网连接)。

附图中的流程图和框图，图示了按照本公开各种实施例的方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分，该模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个接连地表示的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图和/或流程图中的每个方框、以及框图和/或流程图中的方框的组合，可以用执行规定的功能或操作的专用的基于硬件的***来实现，或者可以用专用硬件与计算机指令的组合来实现。描述于本公开实施例中所涉及到的模块、单元可以通过软件的方式实现，也可以通过硬件的方式来实现。其中，模块、单元的名称在某种情况下并不构成对该模块或单元本身的限定。

注意，上述仅为本公开的较佳实施例及所运用技术原理。本领域技术人员会理解，本公开不限于这里所述的特定实施例，对本领域技术人员来说能够进行各种明显的变化、重新调整和替代而不会脱离本公开的保护范围。因此，虽然通过以上实施例对本公开进行了较为详细的说明，但是本公开不仅仅限于以上实施例，在不脱离本公开构思的情况下，还可以包括更多其他等效实施例，而本公开的范围由所附的权利要求范围决定。

Claims (10)

1.一种标题显示方法，其特征在于，包括：

获取标题在页面中的位置区域；

判断所述标题在所述页面中的位置区域是否超出了屏幕；

若是，将所述标题固定在所述屏幕的预设位置。

2.根据权利要求1所述的方法，其特征在于，还包括：

若所述标题在所述页面中的位置没有超出所述屏幕，将所述标题设置为非固定状态。

3.根据权利要求2所述的方法，其特征在于，

所述获取标题在页面中的位置区域，包括：

获取用于存放标题内容的标题容器的top属性值、bottom属性值、left属性值和right属性值；

相应的，判断所述标题在所述页面中的位置区域是否超出了所述屏幕，包括：基于所述标题容器的top属性值、bottom属性值、left属性值和right属性值判断所述标题容器是否超出屏幕。

4.根据权利要求2或3所述的方法，其特征在于，

所述获取标题在页面中的位置区域，包括：

通过创建节点查询选择器获取目标节点对象，并获取所述目标节点对象中用于存放标题内容的标题容器的top属性值、bottom属性值、left属性值和right属性值；

其中，所述目标节点对象中包含容器标签，所述容器标签作为所述标题容器，所述容器标签中包含标题容器的top属性值、bottom属性值、left属性值和right属性值。

5.根据权利要求3所述的方法，其特征在于，

所述基于所述标题容器的top属性值、bottom属性值、left属性值和right属性值判断所述标题容器是否超出屏幕，包括：

若所述标题容器的top属性值、bottom属性值、left属性值和right属性值中任何一个属性值小于零，判断所述标题容器超出屏幕；

若所述标题容器的top属性值、bottom属性值、left属性值和right属性值均不小于零，判断所述标题容器没有超出屏幕。

6.根据权利要求4所述的方法，其特征在于，所述目标节点对象中还包含目标变量；所述目标变量的top属性值、bottom属性值、left属性值和right属性值分别作为所述标题容器的top属性值、bottom属性值、left属性值和right属性值；

所述将所述标题固定在所述屏幕的预设位置，包括：

判断目标变量的位置属性值是否为固定的，

若否，将所述目标变量的位置属性值修改为固定的；

基于目标变量的top属性值、bottom属性值、left属性值和right属性值将所述标题容器进行固定。

7.根据权利要求4所述的方法，其特征在于，所述节点对象中还包含目标变量；所述目标变量的位置属性值作为所述标题容器的位置属性值；

所述若所述标题在所述页面中的位置没有超出所述屏幕，将所述标题设置为非固定状态，包括：

若所述标题容器没有超出所述屏幕，判断目标变量的位置属性值是否为相对的；

若否，将所述目标变量的位置属性值修改为相对的。

8.一种标题显示装置，其特征在于，包括：

位置获取模块，用于获取标题在页面中的位置区域；

判断模块，用于判断所述标题在所述页面中的位置区域是否超出了屏幕；

固定模块，用于若是，将所述标题固定在所述屏幕的预设位置。

9.一种电子设备，其特征在于，包括：

一个或多个处理器；

存储装置，用于存储一个或多个程序，

当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现如权利要求1-7任一项所述的一种标题显示方法。

10.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，该程序被处理器执行时实现如权利要求1-7任一项所述的一种标题显示方法。

Images