CN103309564A - 元素信息的显示方法及装置 - Google Patents
元素信息的显示方法及装置 Download PDFInfo
- Publication number
- CN103309564A CN103309564A CN2013102725665A CN201310272566A CN103309564A CN 103309564 A CN103309564 A CN 103309564A CN 2013102725665 A CN2013102725665 A CN 2013102725665A CN 201310272566 A CN201310272566 A CN 201310272566A CN 103309564 A CN103309564 A CN 103309564A
- Authority
- CN
- China
- Prior art keywords
- character
- area
- user
- background luminance
- predetermined
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
Images
Landscapes
- User Interface Of Digital Computer (AREA)
Abstract
本发明公开了一种元素信息的显示方法及装置。其中,该方法包括:将当前页面中的命中元素显示在第一区域,其中,第一区域的第一背景亮度与当前页面的页面亮度不相同,其中,命中元素是以用户输入的搜索关键字进行搜索得到的结果;按照预定放大显示比例,将命中元素中被用户选中的第一字符元素放大显示在第二区域,其中,第二区域的第二背景亮度与第一背景亮度不相同。通过本发明,达到了增强了用户视觉效果,使得用户能够快速定位查找到的字符效果。
Description
技术领域
本发明涉及互联网领域,具体而言,涉及一种元素信息的显示方法及装置。
背景技术
通常情况下,完成一个信息的查找需要从以下三个方面进行综合考虑:(1)保证查找内容的有效性,即可以显示正确的信息;(2)保证查找内容的完整性,即可以将查找的信息无缺漏的找出;(3)保证查找内容的易定位性,即可以在多查找内容中方便快速地进行定位。
当前的查找方式基本上都可以做到(1)和(2),但是对于(3)中的易定位性上表现并不突出,当前查找方式在查找过程中仅仅以同一色系的不同深度来区别当前选中文字(即查找内容)和未选中文字,如果在有相近于选中文字的底色的页面上,基本看不出查找到的文字。而且,在查找内容的显示过程中,当从选中文字从前一个词跳到下一个词时,当前查找方式也仅仅是对页面位置和颜色进行静态改变,如果不仔细观察很难寻找到当前高亮文字。显然,这样是不能对查找内容进行方便快速的定位的。
发明内容
本发明提供了一种元素信息的显示方法及装置,以至少解决“浏览器无法对需要查找的内容进行快速定位、以及对查找结果的显示效果较差”的问题。
根据本发明的一个方面,提供了一种元素信息的显示方法,包括:将当前页面中的命中元素显示在第一区域,其中,第一区域的第一背景亮度与当前页面的页面亮度不相同,其中,命中元素是以用户输入的搜索关键字进行搜索得到的结果;按照预定放大显示比例,将命中元素中被用户选中的第一字符元素放大显示在第二区域,其中,第二区域的第二背景亮度与第一背景亮度不相同。
优选地,按照预定缩小显示比例,将放大后的第一字符元素缩小显示在第三区域。
优选地,在将当前页面中的命中元素显示在第一区域的同时,还包括:将当前页面显示为灰暗区域,其中,灰暗区域的亮度小于页面亮度。
优选地,页面亮度为当前页面在用户输入对应于命中元素的搜索请求消息之前处于正常显示状态时的亮度。
优选地,第一背景亮度大于页面亮度,且第二背景亮度大于第一背景亮度。
优选地,预定缩小显示比例的值小于等于第一字符元素与放大后的第一字符元素的比值。
优选地,第三区域的第三背景亮度小于等于第二背景亮度、且大于灰暗区域的亮度。
优选地,第三区域的第三背景亮度小于等于第二背景亮度、且大于等于第一背景亮度。
优选地,当第一字符元素包括一个字符时,按照预定放大显示比例,将命中元素中被用户选中的第一字符元素放大显示在第二区域,包括:按照预定放大显示比例将字符显示在第二区域。
优选地,当第一字符元素包括多个字符时,按照预定放大显示比例,将命中元素中被用户选中的第一字符元素放大显示在第二区域,包括:按照预定放大显示比例和第一预定显示顺序将多个字符中的每个字符依次放大显示在第二区域;按照预定缩小显示比例,将放大显示后的第一字符元素缩小显示在第三区域,包括:按照预定缩小显示比例和第二预定显示顺序将位于第二区域的每个字符依次缩小显示在第三区域。
优选地,第一预定显示顺序和第二预定显示顺是相同的。
优选地,在按照预定缩小显示比例,将放大显示后的第一字符元素缩小显示在第三区域之后,该方法还包括:当用户的选中对象从第一字符元素跳转至命中元素中的第二字符元素时,将先被放大显示再被缩小显示后的第一字符元素显示在第一区域。
根据本发明的另一方面,提供了一种元素信息的显示装置,包括:第一显示模块,用于将当前页面中的命中元素显示在第一区域,其中,第一区域的第一背景亮度与当前页面的页面亮度不相同,其中,命中元素是以用户输入的搜索关键字进行搜索得到的结果;第二显示模块,用于按照预定放大显示比例,将命中元素中被用户选中的第一字符元素放大显示在第二区域,其中,第二区域的第二背景亮度与第一背景亮度不相同。
优选地,该装置还包括:第三显示模块,用于按照预定缩小显示比例,将放大后的第一字符元素缩小显示在第三区域。
通过本发明,采用将用户需要搜到的关键字以高亮显示并将用户当前选中的关键字区域以动态高亮区域显示的方式,解决了浏览器无法对需要查找的内容进行快速定位、以及对查找结果的显示效果较差的问题,进而达到了增强了用户视觉效果,使得用户能够快速定位查找到的字符效果。
附图说明
此处所说明的附图用来提供对本发明的进一步理解,构成本申请的一部分,本发明的示意性实施例及其说明用于解释本发明,并不构成对本发明的不当限定。在附图中:
图1是根据本发明实施例的元素信息的显示方法流程图;
图2是根据本发明实施例的元素信息的显示装置的结构框图;
图3是根据本发明优选实施例的元素信息的显示装置的结构框图;
图4是根据本发明优选实施例的元素信息的显示流程图。
具体实施方式
下文中将参考附图并结合实施例来详细说明本发明。需要说明的是,在不冲突的情况下,本申请中的实施例及实施例中的特征可以相互组合。
以下实施例可以应用到浏览器中,该浏览器可以是用在计算机上的浏览器,或者也可以是用在移动设备上的浏览器。当然,以下实施例也可以用于对操作***中的信息元素查找。例如,在操作***中的文本阅读工具中查找用户需要的字符,但不限于此。
本实施例提供了一种元素信息的显示方法,图1是根据本发明实施例的元素信息的显示方法流程图,如图1所示,该方法主要包括以下步骤(步骤S102-步骤S104):
步骤S102,将当前页面中的命中元素显示在第一区域,其中,第一区域的第一背景亮度与当前页面的页面亮度不相同,其中,命中元素是以用户输入的搜索关键字进行搜索得到的结果;
作为本发明的一种实施方式,首先根据用户输入的搜索关键字或关键字符在当前页面中进行搜索,查找到一个或多个相应的命中元素,其中,命中元素通常是指以用户输入的搜索关键字进行搜索得到的结果,即用户查找内容的结果,通常可以包括文字字符类元素、视频元素、图片元素等,例如:一个完整的词语。
步骤S104,按照预定放大显示比例,将命中元素中被用户选中的第一字符元素放大显示在第二区域,其中,第二区域的第二背景亮度与第一背景亮度不相同。
通过本实施例的上述步骤,可以将用户需要搜索的关键字或关键字符以不同于当前页面亮度的区域显示出来,当然,这里的区域的背景亮度仅仅是与当前页面的亮度不同而已,例如,当当前页面的亮度比较大时,可以将该区域设定为背景亮度较暗(例如,可以通过不同的背景色突出显示)的区域,当当前页面的亮度比较小时,可以将该区域设定为背景亮度较亮(例如,可以通过不同的背景色突出显示)的区域。这样,就可以使用户能够很快速地在当前页面中找到需要搜索的关键字或关键字符(称之为命中元素)。
为了便于理解,现举例说明,假如当用户需要在浏览器的当前页面(包含多个北京园博会的相关内容)中得到“从北京站到北京园博会地址”的公交路线信息,为了得到尽可能多的相关路线信息,其只需要使用“北京园博会”作为搜索关键字,则浏览器会将当前页面中所有“北京园博会”以突出的背景色显示出来,例如黄色。在这里,所有被以黄色背景色显示的“北京园博会”就是命中元素,每个“北京园博会”就属于命中元素的字符元素,每个“北京园博会”的黄色背景色区域就是上述第一区域,该黄色背景色区域的背景亮度即上述第一背景亮度,当然“黄色”可以以其他颜色来替代,只要背景区域的亮度与当前页面的主要颜色的亮度容易区别即可。
此时,浏览器的光标所在的位置处的信息可能并不是用户想要得到的与公交路线相关,那么用户可以使用鼠标或是键盘移动光标的位置,比如,用户从最前面的字符元素(第1个“北京园博会”)处移动到第5个字符元素(第5个“北京园博会”)处的时候,发现包含第5个“北京园博会”的文字信息中涵盖有“从北京站到北京园博会地址”的公交路线信息,用户就可以停止操作了。在这个过程中,第1个“北京园博会”至第5个“北京园博会”都可以被颜色亮度不同于黄色亮度的其他背景区域(即上述第二区域)显示,例如,可以以亮度更大的深黄色作为背景色,该深黄色背景区域的亮度即上述第二背景亮度,当然也选择其他颜色作为背景色,只要能够与当前的黄色背景区域明显区别就可以。
为了达到更好的显示效果,以足以引起用户的注意力,还可以在执行步骤S104之后,按照预定缩小显示比例,将放大后的第一字符元素缩小显示在第三区域。
在本实施例中,当搜索到的结果(命中元素)有多个时,可以将用户当前选中的一个命中元素显示为与所有命中元素不同的背景亮度,这样,用户可以很轻松地从多个命中元素中找到自己选中的命中元素。更进一步地,可以将用户选中的命中元素进行放大显示,这样能够使选中的命中元素更加明显地区别于其他未选中的命中元素。
优选地,在将当前页面中的命中元素显示在第一区域的同时,为了使用户更容易区别出命中元素与当前页面,还可以将当前页面显示为灰暗区域,其中,灰暗区域的亮度小于页面亮度,其中,页面亮度为当前页面在用户输入对应于命中元素的搜索请求消息之前处于正常显示状态时的亮度。
在本实施例一个优选实施方式中,第一背景亮度可以大于页面亮度,且第二背景亮度大于第一背景亮度。这样做的好处是能够用户能够对当前页面中的除命中元素之外的其他元素、命中元素,以及被用户当前选中的命中元素进行非常明显的区分,使用户一目了然。
对于在显示用户选中的命中元素(即上述第一字符元素)的过程中,采用的是先将该字符元素放大再缩小的方式,而同时将其所在区域(即上述第二区域)显示为背景亮度不同于第一区域的背景亮度。其中,预定缩小显示比例的值小于等于第一字符元素与放大后的第一字符元素的比值,在这种情况下,经过先放大显示操作后经过缩小显示操作的第一字符元素与未被放大之前的第一字符元素的大小是相同的,即在显示过程中,仅仅是第一字符元素放大一下再回复至原来的大小,这本质上是一个动态显示过程(即具有动画显示效果)。
当这里需要说明的是,这里保持动态显示完成后的第一字符元素的大小不变仅仅是一个较佳的实施方式而已,例如,在实际应用中,可以采用如下方式:
(1)先放大第一字符元素后,再缩小,但是缩小后的第一字符元素比未被放大前的第一字符元素要大;
(2)先放大第一字符元素后,再缩小,但是缩小后的第一字符元素比未被放大前的第一字符元素要小。
在本实施例一个优选实施方式中,为了更加明显区分显示效果,第三区域的第三背景亮度可以小于等于第二背景亮度、且大于灰暗区域的亮度,或者,第三区域的第三背景亮度小于等于第二背景亮度、且大于等于第一背景亮度。采用这样的实施方式,在页面变暗、所有命中元素变亮、且当前被选中的命中元素在显示过程中先变得更亮再恢复至命中元素的背景亮度的一系列显示过程中,用户可以很方便地找到自己要精准定位的关键字(即被选中的命中元素)。
当然,在实际应用中,命中元素包括两种情况:(1)只包括一个字符元素,例如,用户只输入了一个关键字“箭”时,当前页面中会有显示有多个包含“箭”的高亮区域(属于第一区域的一种情况);(2)包括两个以上的字符元素,例如,用户输入了两个关键字“火箭”时,当前页面中会有出现多个包含“火箭”的高亮区域(属于第一区域的一种情况)。
此时,为了达到更明显的显示效果,可以对这两种情况进行区分,当第一字符元素包括一个字符时,在实施按照预定放大显示比例,将命中元素中被用户选中的第一字符元素放大显示在第二区域的过程中,可以按照预定放大显示比例将字符显示在第二区域。当第一字符元素包括多个字符时,在按照预定放大显示比例,将命中元素中被用户选中的第一字符元素放大显示在第二区域的过程中,可以先按照预定放大显示比例和第一预定显示顺序将多个字符中的每个字符依次放大显示在第二区域,在按照预定缩小显示比例,将放大显示后的第一字符元素缩小显示在第三区域的过程中,可以再按照预定缩小显示比例和第二预定显示顺序将位于第二区域的每个字符依次缩小显示在第三区域。
优选地,在这先后两个显示顺序中,第一预定显示顺序和第二预定显示顺序可以是相同的,例如,用户输入的多个关键字为“天安门”,可以按照上述显示过程从左到右显示这三个字符元素,也可以按照上述显示过程从右到左显示这三个字符元素,当然,如果关键字的个数很多的情况下,还可以采取其他的显示顺序,完全不局限于此处的两个显示顺序。
在本实施例另一个优选实施方式中,在按照预定缩小显示比例,将放大显示后的第一字符元素缩小显示在第三区域之后,当用户的选中对象从第一字符元素跳转至命中元素中的第二字符元素时,还可以将先被放大显示再被缩小显示后的第一字符元素显示在第一区域。也就是说,在用户切换当前被选中的命中元素的过程中,切换后不再被选中的命中元素可以恢复到第一区域的,即将其背景亮度由第三背景亮度恢复到第一背景亮度。
通过本实施例,可以使命中元素的背景亮度区分于页面亮度、使被用户选中的命中元素的背景亮度区分于页面亮度与未被选中的命中元素的背景亮度,并可以动态显示被用户选中的命中元素。显然,动态显示过程能够很好地使用户快速区分其需要精确定位的关键字,能够大大提高用户的搜索体验。
图2是根据本发明实施例的元素信息的显示装置的结构框图,该装置用于实现上述方法实施例提供的元素信息的显示方法,如图2所示,该元素信息的显示装置可以包括:第一显示模块10和第二显示模块20。其中,第一显示模块10,用于将当前页面中的命中元素显示在第一区域,其中,第一区域的第一背景亮度与当前页面的页面亮度不相同,其中,命中元素是以用户输入的搜索关键字进行搜索得到的结果;第二显示模块20,用于按照预定放大显示比例,将命中元素中被用户选中的第一字符元素放大显示在第二区域,其中,第二区域的第二背景亮度与第一背景亮度不相同。
为了达到更好的显示效果,足以引起用户的注意,还可以对图2所示的装置进行进一步的优化。图3是根据本发明优选实施例的元素信息的显示装置的结构框图,如图3所示,该装置还可以包括:第三显示模块30,用于按照预定缩小显示比例,将放大后的第一字符元素缩小显示在第三区域。
需要说明的是,本实施例中所涉及到的模块可以通过软件的方式实现,也可以通过硬件的方式来实现。其中所描述的模块也可以在处理器中,例如,一种处理器包括第一显示模块10、第二显示模块20以及第三显示模块30。其中,这些模块的名称在某些情况下并不构成对该模块本身的限定,例如,第一显示模块还可以描述为“用于显示命中元素的模块”。
在另外一个实施例中,还提供了一种软件,该软件用于执行上述实施例及优选实施方式中描述的技术方案。
在另外一个实施例中,还提供了一种存储介质,该存储介质中存储有上述软件,该存储介质包括但不限于:光盘、软盘、硬盘、可擦写存储器等。
下面结合图4以及优选实施例对上述实施例提供的元素信息的显示方法进行更详细的说明。
图4是根据本发明优选实施例的元素信息的显示流程图,该方法中显示网页页面的浏览器为Trident/Webkit双核浏览器,如图4所示,该方法包括如下的步骤S402至步骤S420:
步骤S402:判断浏览器在显示当前网页页面时的内核类型。
首先,浏览器接收用户输入的字符,在实际应用中,用户通过浏览器打开网页页面,欲在网页页面上查找字符时,可通过快捷方式,例如ctrl+f,或者通过菜单选择,打开查找对话框,并在查找对话框中输入要查找的字符,例如输入汉字、汉语词语、英文字母、英文单词、数字等字符,触发浏览器的查找功能,调用查找程序。
优选地,浏览器在接收到用户输入的文字,开始查找文字后,先判断浏览器在显示当前网页页面时的内核类型,如果浏览器在显示当前网页页面时的内核类型为Trident内核,则执行步骤S404,如果浏览器在显示当前网页页面时的内核类型为Webkit内核,则执行步骤S410。但是,不管在哪种内核下,浏览器在获取网页页面上的元素之后,递归判断当前页面元素属于何种类别元素,也就是判断当前元素所属类别是字符、视频、图片、程序编码、flash等类别中的哪一种,从中筛选出字符类元素,抛弃视频、图片、程序编码、flash等元素;然后将各个字符类元素与用户输入的字符进行匹配,相匹配的元素即为查找到的命中元素(即上述用户需要查找的字符元素)。
步骤S404:调用用于执行Javascript脚本的函数IHTMLWindow2::execScript,以执行Javascript。
步骤S406:在Javascript开始执行时,调用查找所有字符元素的函数THTMLBodyElement::createTextRange得到ITextRange对象,其中,ITextRange对象是由网页页面上查找到的所有文字构成的元素集。
步骤S408:通过函数ITextRange::findText(文本)ITextRange::parentElement,在ITextRange对象中查找与用户输入文字匹配的元素,以在元素集中查找与字符匹配的命中元素,其中,函数中的“文本”即为用户输入文字,其中,当查找到命中元素时,执行步骤S416,否者查找结束,输出查找结果。
步骤S410:调用用于执行Javascript脚本的函数WebFrame::executeScript,以执行Javascript。
步骤S412:枚举NoteType为Text的结点,其中,枚举到的结点是由网页页面上查找到的所有文字构成的元素集。
步骤S414:遍历Text结点,判断结点是否包含用户输入的文字,以在元素集中查找与字符匹配的元素,即命中元素,其中,当查找到命中元素时,执行步骤S416,否者查找结束,输出查找结果。
步骤S416:新建并显示半透明的元素,大小为显示页面大小,使得网页页面上具有蒙层的效果,整个网页具有处于暗淡的视觉效果。
步骤S418:调整命中元素的CSS属性,保证突出显示。通过步骤S416的蒙层效果减弱了页面中不相关元素的视觉干扰,而突出显示强化了命中元素的视觉冲击,使得命中元素与暗淡的网页形成视觉对比。
步骤S420:在命中元素的位置显示查找动画。
优选地,创建与命中元素相同的新建元素,然后计算命中元素在网页页面上的准确位置,将新建元素覆盖在找到元素上,也即将新建元素置于找到元素的位置二者重合,在控制新建元素变化显示时,会产生找到元素变化显示的视觉效果。
优选地,通过以下方式控制新建元素变化。在一定周期内以一定频率控制此新建元素的宽、高以及颜色,实现新建元素放大、变亮的动态渐变效果。当新建元素的实际大小、颜色达到一个临界值时,从页面中删除该新建元素。设计者可以自由的设计显示方式,例如让新建元素闪烁,让新建元素逐渐变大、变亮,让新建元素旋转等等,增强了用户的视觉效果,使得用户能够快速定位到查找到的字符。
在该优选实施例中,通过创建一个与命中元素相同的新建元素,并控制新建元素在命中元素的位置上按照预设的方式显示,能够产生命中元素按照预设的方式进行显示的视觉效果,设计者可根据当前页面内容、格式等特征,设置不同的显示方式,从而增强了浏览器在网页页面上查找字符时显示效果,也即增强了用户视觉效果,使得用户能够快速定位查找到的字符。
在得到命中元素后,确定命中元素在网页页面上的准确位置,也即计算命中元素在网页页面上的坐标信息,并且当网页页面大小发生变化后,重新计算坐标信息确定命中元素的位置,以保证确定的命中元素的位置随网页变化而变化,使得无论何时都可以对命中元素进行精确定位。
在获得命中元素的准确位置后,将新建元素置于命中元素的位置,使得新建元素覆盖在命中元素上,从视觉角度上来看,命中元素并未发生任何变化;覆盖后,对新建元素进行控制,使其按照预设的方式显示,再从视觉角度上看,相当于命中元素按照预设的方式显示,设计者可以自由的设计显示方式,例如让新建元素闪烁,让新建元素逐渐变大、变亮,让新建元素旋转等等,增强了用户的视觉效果,使得用户能够快速定位到查找到的字符。
例如,当用户输入的字符为“人人”时,通过步骤S104在网页页面上查找到“人人”后,创建一个内容为“人人”、大小与查找到的“人人”相同的元素。当在网页页面上查找到多个“人人”时,可分别对应创建多个新建元素,并将所有新建元素分别覆盖在对应的命中元素上,并控制全部新建元素按照预设的方式进行显示,从视觉角度上看,网页页面上所有“人人”按照预设方式显示。
或者,可控制各个新建元素依次一一按照预设的方式进行显示,从视觉角度上看,网页页面上各个“人人”依次按照预设方式显示,若预设的方式显示为新建元素逐渐变大、变亮,则控制第一个新建的“人人”逐渐变大、变亮,直到变大后的“人人”的大小大于预设的大小阈值,或者变亮后的“人人”的亮度大于预设的亮度阈值,删除第一个新建的“人人”,再控制第二个新建的“人人”逐渐变大、变亮,直到变大后的“人人”的大小大于预设的大小阈值,或者变亮后的“人人”的亮度大于预设的亮度阈值,删除第二个新建的“人人”,再控制第三个……,以此类推。
在实际应用中,在查找命中元素的过程中,忽略网页页面上的隐藏元素。可在查找网页页面上的字符类元素时直接忽略隐藏元素,也可在得到元素集后,将元素集中的隐藏元素删除,从而使得与字符相匹配的隐藏元素不显示在网页页面上;接着,在得到命中元素后,可以创建与网页页面的大小相同半透明元素,并控制半透明元素覆盖在网页页面上显示;调整命中元素的CSS属性,例如,使得调整后的使命中元素在网页页面上高亮显示。
优选地,如果找到与用户输入字符相匹配的元素,则通过新建并显示的半透明元素,从而可以看到网页上增加了蒙层效果,使得网页在视觉上处于暗淡的状态,减弱页面中其他不相关元素的干扰,而通过用高亮特效标记所有与查找字符相匹配的页面元素,使得命中元素与网页页面上其他不相关元素形成较大的视觉反差。如果网页没有与用户输入字符相匹配的元素,页面不显示蒙层效果。因而,从页面整体的变化向用户输出网页页面上是否存在用户所查找字符,信息输出直观,用户体验好。
在将所有命中元素在网页页面上进行高亮显示后,创建各个命中元素对应的新建元素,并根据用户输入的切换指令依次显示各个新建元素。该处的切换指令用于查找一个命中元素的下一个命中元素,例如,在网页页面上设置或通过对话框设置命令按钮,当用户点击该命令按钮时,由显示当前命中元素的新建元素跳转到显示下一个命中元素的新建元素。
例如,可以通过以下方式来实现:创建与第n个命中元素的大小、内容相同的元素,以得到第n新建元素,在使命中元素高亮显示后,首先创建第一个命中元素对应的新建元素,其中,所有命中元素的顺序可根据命中元素的位置排列,例如,由左至右、从上至下。控制第n新建元素覆盖在第n个元素上,并按照预设方式显示,接收到用户输入的切换命令之后,删除第n新建元素;判断第n个命中元素是否为最后一个命中元素,其中,当第n个命中元素为最后一个命中元素时,查找结束,输出查找结果,例如通过对话框输出“查找完毕,共找到n个”的信息。
将所有命中元素对应的新建元素显示完成后,也即将网页页面上所有查找到的元素依次显示给用户。其中,优选地,新建元素具有底色,例如新建元素的默认颜色为浅黄色,预设的显示方式为新建元素逐渐变亮、变大,新建元素逐渐变大,并且颜色逐渐由浅黄变为黄色、深黄色,直至大小变至预设的大小、亮度变至预设的亮度停止变化,当接收到切换命令时,当前显示的新建元素被删除,控制下一个命中元素的新建元素由默认亮度和默认大小逐渐变化。
采用上述实施例提供的元素信息的显示方法,通过将用户需要搜到的关键字以高亮显示并将用户当前选中的关键字区域以动态高亮区域显示的方式,解决了浏览器无法对需要查找的内容进行快速定位、以及对查找结果的显示效果较差的问题,进而达到了增强了用户视觉效果,使得用户能够快速定位查找到的字符效果。
采用上述实施例提供的元素信息的显示装置,通过将用户需要搜到的关键字以高亮显示并将用户当前选中的关键字区域以动态高亮区域显示的方式,解决了浏览器无法对需要查找的内容进行快速定位、以及对查找结果的显示效果较差的问题,进而达到了增强了用户视觉效果,使得用户能够快速定位查找到的字符效果。
从以上的描述中,可以看出,本发明实现了如下技术效果:通过在网页页面上查找到与用户输入字符相匹配的元素时,在网页页面上显示蒙层效果,能够直观地向用户输出是否查找到的信息;修改查找到的元素的CSS属性,使得查找到的元素在页面中特殊标注(例如以亮度不同的高亮区域显示)出来,与网页的蒙层效果构成对比,使得查找到的元素与其他不相关的元素形成视觉对比,有利于用户快速获取到查找的元素;在用户通过切换命令对每个查找到的元素进行定位时,通过创建与命中元素相同的新建元素,并控制新建元素渐变显示,具有动态的视觉效果,有利于用户快速进行定位。
显然,本领域的技术人员应该明白,上述的本发明的各模块或各步骤可以用通用的计算装置来实现,它们可以集中在单个的计算装置上,或者分布在多个计算装置所组成的网络上,可选地,它们可以用计算装置可执行的程序代码来实现,从而,可以将它们存储在存储装置中由计算装置来执行,并且在某些情况下,可以以不同于此处的顺序执行所示出或描述的步骤,或者将它们分别制作成各个集成电路模块,或者将它们中的多个模块或步骤制作成单个集成电路模块来实现。这样,本发明不限制于任何特定的硬件和软件结合。
以上所述仅为本发明的优选实施例而已,并不用于限制本发明,对于本领域的技术人员来说,本发明可以有各种更改和变化。凡在本发明的精神和原则之内,所作的任何修改、等同替换、改进等,均应包含在本发明的保护范围之内。
Claims (14)
1.一种元素信息的显示方法,其特征在于,包括:
将当前页面中的命中元素显示在第一区域,其中,所述第一区域的第一背景亮度与所述当前页面的页面亮度不相同,其中,所述命中元素是以用户输入的搜索关键字进行搜索得到的结果;
按照预定放大显示比例,将所述命中元素中被用户选中的第一字符元素放大显示在第二区域,其中,所述第二区域的第二背景亮度与所述第一背景亮度不相同。
2.根据权利要求1所述的方法,其特征在于,在将所述命中元素中被用户选中的第一字符元素放大显示在第二区域之后,还包括:
按照预定缩小显示比例,将放大后的第一字符元素缩小显示在第三区域。
3.根据权利要求1或2所述的方法,其特征在于,在将当前页面中的命中元素显示在第一区域的同时,还包括:
将所述当前页面显示为灰暗区域,其中,所述灰暗区域的亮度小于所述页面亮度。
4.根据权利要求1或2所述的方法,其特征在于,所述页面亮度为所述当前页面在用户输入对应于所述命中元素的搜索请求消息之前处于正常显示状态时的亮度。
5.根据权利要求1或2所述的方法,其特征在于,所述第一背景亮度大于所述页面亮度,且所述第二背景亮度大于所述第一背景亮度。
6.根据权利要求2所述的方法,其特征在于,所述预定缩小显示比例的值小于等于所述第一字符元素与所述放大后的第一字符元素的比值。
7.根据权利要求2所述的方法,其特征在于,所述第三区域的第三背景亮度小于等于所述第二背景亮度、且大于所述灰暗区域的亮度。
8.根据权利要求2所述的方法,其特征在于,所述第三区域的第三背景亮度小于等于所述第二背景亮度、且大于等于所述第一背景亮度。
9.根据权利要求1或2所述的方法,其特征在于,当所述第一字符元素包括一个字符时,
按照预定放大显示比例,将所述命中元素中被用户选中的第一字符元素放大显示在第二区域,包括:
按照所述预定放大显示比例将所述字符显示在所述第二区域。
10.根据权利要求1或2所述的方法,其特征在于,当所述第一字符元素包括多个字符时,
按照预定放大显示比例,将所述命中元素中被用户选中的第一字符元素放大显示在第二区域,包括:按照所述预定放大显示比例和第一预定显示顺序将所述多个字符中的每个字符依次放大显示在所述第二区域;
按照预定缩小显示比例,将放大显示后的第一字符元素缩小显示在第三区域,包括:按照所述预定缩小显示比例和第二预定显示顺序将位于所述第二区域的每个字符依次缩小显示在所述第三区域。
11.根据权利要求10所述的方法,其特征在于,所述第一预定显示顺序和所述第二预定显示顺是相同的。
12.根据权利要求2、6、7、或8所述的方法,其特征在于,在按照预定缩小显示比例,将放大显示后的第一字符元素缩小显示在第三区域之后,所述方法还包括:
当用户的选中对象从所述第一字符元素跳转至所述命中元素中的第二字符元素时,将先被放大显示再被缩小显示后的第一字符元素显示在所述第一区域。
13.一种元素信息的显示装置,其特征在于,包括:
第一显示模块,用于将当前页面中的命中元素显示在第一区域,其中,所述第一区域的第一背景亮度与所述当前页面的页面亮度不相同,其中,所述命中元素是以用户输入的搜索关键字进行搜索得到的结果;
第二显示模块,用于按照预定放大显示比例,将所述命中元素中被用户选中的第一字符元素放大显示在第二区域,其中,所述第二区域的第二背景亮度与所述第一背景亮度不相同。
14.根据权利要求13所述的装置,其特征在于,所述装置还包括:
第三显示模块,用于按照预定缩小显示比例,将放大后的第一字符元素缩小显示在第三区域。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN2013102725665A CN103309564A (zh) | 2013-07-01 | 2013-07-01 | 元素信息的显示方法及装置 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN2013102725665A CN103309564A (zh) | 2013-07-01 | 2013-07-01 | 元素信息的显示方法及装置 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN103309564A true CN103309564A (zh) | 2013-09-18 |
Family
ID=49134847
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN2013102725665A Pending CN103309564A (zh) | 2013-07-01 | 2013-07-01 | 元素信息的显示方法及装置 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN103309564A (zh) |
Cited By (8)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN104462418A (zh) * | 2014-12-11 | 2015-03-25 | 小米科技有限责任公司 | 页面显示方法及装置、电子设备 |
CN105095362A (zh) * | 2015-06-25 | 2015-11-25 | 深圳码隆科技有限公司 | 一种基于目标对象的图像显示方法和装置 |
CN107392052A (zh) * | 2017-08-02 | 2017-11-24 | 泰州市抗震办公室(泰州市建设工程施工图设计审查中心) | 一种施工图审查用的cad在线标注***及在线标注方法 |
CN107729445A (zh) * | 2017-09-30 | 2018-02-23 | 长城计算机软件与***有限公司 | 一种基于html5的大文本阅读定位及显示方法 |
CN111291202A (zh) * | 2018-12-07 | 2020-06-16 | 北京奇虎科技有限公司 | 一种基于ppt的高亮显示方法及装置 |
CN112269512A (zh) * | 2020-10-30 | 2021-01-26 | 湖南快乐阳光互动娱乐传媒有限公司 | 移动设备单手操作方法及装置 |
CN113805991A (zh) * | 2021-08-30 | 2021-12-17 | 北京达佳互联信息技术有限公司 | 一种对象提示方法、装置、电子设备及存储介质 |
CN114586008A (zh) * | 2019-08-09 | 2022-06-03 | 荣耀终端有限公司 | 显示页面元素的方法和电子设备 |
Citations (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101057239A (zh) * | 2004-11-10 | 2007-10-17 | 苹果电脑有限公司 | 增亮用于搜索结果的项 |
CN101568923A (zh) * | 2006-12-21 | 2009-10-28 | 微软公司 | 搜索结果的可视化和导航 |
CN101833574A (zh) * | 2010-04-15 | 2010-09-15 | 西安酷派软件科技有限公司 | 一种应用程序的定位方法、***及移动终端 |
CN102934109A (zh) * | 2010-05-20 | 2013-02-13 | 萨基姆通讯宽带公司 | 用于在通过搜索引擎获得的搜索结果内进行导航的方法 |
-
2013
- 2013-07-01 CN CN2013102725665A patent/CN103309564A/zh active Pending
Patent Citations (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101057239A (zh) * | 2004-11-10 | 2007-10-17 | 苹果电脑有限公司 | 增亮用于搜索结果的项 |
CN101568923A (zh) * | 2006-12-21 | 2009-10-28 | 微软公司 | 搜索结果的可视化和导航 |
CN101833574A (zh) * | 2010-04-15 | 2010-09-15 | 西安酷派软件科技有限公司 | 一种应用程序的定位方法、***及移动终端 |
CN102934109A (zh) * | 2010-05-20 | 2013-02-13 | 萨基姆通讯宽带公司 | 用于在通过搜索引擎获得的搜索结果内进行导航的方法 |
Cited By (9)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN104462418A (zh) * | 2014-12-11 | 2015-03-25 | 小米科技有限责任公司 | 页面显示方法及装置、电子设备 |
CN105095362A (zh) * | 2015-06-25 | 2015-11-25 | 深圳码隆科技有限公司 | 一种基于目标对象的图像显示方法和装置 |
CN107392052A (zh) * | 2017-08-02 | 2017-11-24 | 泰州市抗震办公室(泰州市建设工程施工图设计审查中心) | 一种施工图审查用的cad在线标注***及在线标注方法 |
CN107729445A (zh) * | 2017-09-30 | 2018-02-23 | 长城计算机软件与***有限公司 | 一种基于html5的大文本阅读定位及显示方法 |
CN107729445B (zh) * | 2017-09-30 | 2020-02-07 | 长城计算机软件与***有限公司 | 一种基于html5的大文本阅读定位及显示方法 |
CN111291202A (zh) * | 2018-12-07 | 2020-06-16 | 北京奇虎科技有限公司 | 一种基于ppt的高亮显示方法及装置 |
CN114586008A (zh) * | 2019-08-09 | 2022-06-03 | 荣耀终端有限公司 | 显示页面元素的方法和电子设备 |
CN112269512A (zh) * | 2020-10-30 | 2021-01-26 | 湖南快乐阳光互动娱乐传媒有限公司 | 移动设备单手操作方法及装置 |
CN113805991A (zh) * | 2021-08-30 | 2021-12-17 | 北京达佳互联信息技术有限公司 | 一种对象提示方法、装置、电子设备及存储介质 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN103309564A (zh) | 元素信息的显示方法及装置 | |
CN102763065B (zh) | 用于导航经过多个查看区域的装置、方法和图形用户接口 | |
TWI570580B (zh) | 巡覽一瀏覽器中之複數個內容項目的方法、電腦系統及電腦程式產品 | |
CN101266520B (zh) | 一种可实现灵活键盘布局的*** | |
KR101633842B1 (ko) | 연속적인 제스쳐 입력을 위한 복수의 그래픽 키보드들 | |
CN104252529A (zh) | 一种地图标注的加载方法和装置 | |
CN105739843A (zh) | 信息展示方法及装置、电子设备 | |
CN105247540A (zh) | 管理实时手写识别 | |
WO2009040687A1 (en) | Method, apparatus and computer program product for providing an adaptive keypad on touch display devices | |
TW201923547A (zh) | 處理方法、裝置、設備和機器可讀媒體 | |
CN104317474A (zh) | 窗口切换方法及装置 | |
KR102072049B1 (ko) | 단말 및 이를 이용한 텍스트 편집방법 | |
TW201923630A (zh) | 處理方法、裝置、設備和機器可讀媒體 | |
CN104808903A (zh) | 文本选择方法和装置 | |
WO2016107462A1 (zh) | 一种信息输入方法、装置及智能终端 | |
CN112947923A (zh) | 对象编辑方法、装置和电子设备 | |
KR20150057138A (ko) | 단말기 및 단말기의 제어 방법 | |
CN106383636A (zh) | 一种索引信息的显示方法及装置 | |
CN105263054A (zh) | 一种信息显示方法、装置及智能电视 | |
US20240220072A1 (en) | Application icon display method and apparatus, and electronic device | |
CN104219586A (zh) | 一种应用于智能电视的输入方法和装置 | |
CN103197765A (zh) | 键盘布局切换方法和调整方法 | |
CN103135786A (zh) | 用于向电子设备输入文本的方法 | |
CN102999556B (zh) | 文字搜索方法、装置以及终端设备 | |
US10387503B2 (en) | Systems and methods involving features of search and/or search integration |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
C06 | Publication | ||
PB01 | Publication | ||
C10 | Entry into substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
RJ01 | Rejection of invention patent application after publication | ||
RJ01 | Rejection of invention patent application after publication |
Application publication date: 20130918 |