一种移动终端搜索图片的预览方法和装置的制造方法_2

文档序号:8445605阅读:来源:国知局
述,各种其他的优点和益处对于本领域普通技术人员将变得清楚明了。附图仅用于示出优选实施方式的目的,而并不认为是对本发明的限制。而且在整个附图中,用相同的参考符号表示相同的部件。在附图中:
[0063]图1是根据本发明实施例一的一种移动终端搜索图片的预览方法的步骤流程图;
[0064]图2是根据本发明实施例二的一种移动终端搜索图片的预览方法的步骤流程图;
[0065]图3a是【背景技术】中的搜索结果示意图;
[0066]图3b是【背景技术】中的搜索对应展示的详情页;
[0067]图3c是本发明实施例中搜索结果页面的示意图;
[0068]图3d是本发明实施例中查看放大图片的一个示意图;
[0069]图3e是本发明实施例中查看放大图片的另一个示意图;
[0070]图4是根据本发明实施例一的一种移动终端搜索图片的预览装置的结构框图;
[0071]图5是根据本发明实施例二的一种移动终端搜索图片的预览装置的结构框图。
【具体实施方式】
[0072]下面将参照附图更详细地描述本公开的示例性实施例。虽然附图中显示了本公开的示例性实施例,然而应当理解,可以以各种形式实现本公开而不应被这里阐述的实施例所限制。相反,提供这些实施例是为了能够更透彻地理解本公开,并且能够将本公开的范围完整的传达给本领域的技术人员。
[0073]实施例一
[0074]详细介绍本发明实施例提供的一种移动终端搜索图片的预览方法。
[0075]参照图1,示出了本发明实施例一的一种移动终端搜索图片的预览方法的步骤流程图。
[0076]步骤101,接收用户在移动搜索客户端上提交的搜索请求。
[0077]用户可以通过网页浏览器或是其他搜索程序(比如“好搜”APP)等移动终端上的搜索客户端提交搜索请求,例如,通过在网页浏览器中访问搜索引擎网站,或是直接打开搜索程序,在相关的输入栏中输入搜索关键词或是点击热门关键词进触发搜索。
[0078]步骤102,获取匹配所述搜索请求的包括对应详情页面的多个缩略图片的搜索结果,并对所述多个缩略图片进行展示。
[0079]用户提交的搜索请求中携带对应的搜索关键词,根据搜索关键词可以进一步获取对应的搜索结果,搜索结果对应有更详细展示的详情页面,搜索结果中可以包括对应详情页面的摘要数据,本发明实施例中,对搜索结果的摘要数据进行合理利用,提取详情页面中图片对应的多个缩略图片,对缩略图片进行前置展现,使移动搜索结果页面中搜索结果的摘要为多图展现形式。用户可以直接在搜索结果页面中看到搜索结果中是否有图,并且可判断图片是否与搜索请求相关,从而可以选择查看符合自己搜索需求的图片。
[0080]步骤103,接收用户对某个缩略图片的访问操作,提取针对所述缩略图片的放大图片。
[0081]本发明实施例针对缩略图片预置有对应的放大图片,用户可以选择查看某个缩略图片,在接收到用户对某个缩略图片的访问操作后,进一步提取缩略图片对应的放大图片。
[0082]步骤104,创建展示所述放大图片的第一页面浮层,并覆盖在所述移动搜索客户端的当前页面上。
[0083]在获取放大图片后,进一步对放大图片进行展示,相比于传统方案,在点击搜索结果后展示对应的详情页面,本发明实施例在点击缩略图片后并不展示搜索结果对应的详情页,而是在移动搜索客户端上创建第一页面浮层对缩略图片对应的放大图片进行展示,用户直接在当前界面上预览详情页面中的图片,提升用户对搜索结果的视觉体验,增强移动搜索客户端的用户粘性,并且,由于无需展示对应的详情页面,减少了向服务器请求页面的操作,节省了移动客户端的流量消耗,同时减轻了移动客户端和服务器的负载。
[0084]放大图片展示在搜索客户端当前页面,也即是搜索结果页面的上方,以悬浮在当前页面的页面浮层的形式展示。
[0085]具体的第一页面浮层可以采用针对当前框架的内联框架iframe实现,iframe是一种页面元素,当访问到iframe元素时,页面会创建包含另外一个文档的内联框架(即行内框架)来展示iframe元素中的内容。应用到本发明实施例,可以将需要进一步放大的缩略图片放入搜索结果页面的iframe元素中,当访问缩略图片时,触发iframe元素生成内联框架展示放大图片。
[0086]也可以通过页面遮罩层技术实现。具体而言,可以在页面中设置两个图层,上面的一个图层为“遮罩层”,下面的称“被遮罩层”,一般使用页面遮罩层技术时,这两个图层中只有相重叠的地方才会被显示。也就是说在遮罩层中有对象的地方就是“透明”的,可以看到被遮罩层中的对象,而没有对象的地方就是不透明的,被遮罩层中相应位置的对象是看不见的。为实现第二页面层遮住第一页面层的部分内容,可以设置第二页面层的展示效果为不透明。
[0087]应用到本发明实施例,可以在编写搜索结果页面时定义两个DIV层,使用一个位于需要被遮罩的DIV层(对应展示搜索结果)之上的另一个DIV层部分覆盖需要被遮罩的DIV层(对应展示放大图片),通过级联样式表CSS定义需要显示的DIV层和遮罩层的样式。其中,通过显示元素的z-1ndex属性控制显示在上方的遮罩层和显示在下方的DIV层在叠加顺序上的上下立体关系。其中,第一页面浮层第二页面层在第一页面层上覆盖的位置可以根据实际的需求设定,本发明对此并不做限制。
[0088]本发明实施例中,优选地,所述第一页面浮层在所述移动搜索客户端全屏展示。对放大图片可以全屏展示,比详情页面中图片展示更大,方便用户查看图片,提升了图片的视觉效果。
[0089]本发明实施例中,优选地,所述搜索结果中包括的多个缩略图片为所述详情页面中首屏展示的图片,或者是详情页面中排序靠前的预设个数的图片分别对应的缩略图片,还可以是从详情页面中根据需要和预设规则选取的缩略图片,本发明对此并不做限制。
[0090]本发明实施例中,优选地,所述接收用户对某个缩略图片的访问操作,提取针对所述缩略图片的放大图片包括:
[0091]子步骤S11,接收用户对其中一张缩略图片的访问操作;
[0092]子步骤S12,查找所访问的所述缩略图片对应的放大图片的链接地址;
[0093]子步骤S13,访问查找的链接地址下载所访问的缩略图片对应的放大图片。
[0094]接收到对缩略图片的访问操作后,进一步查找其对应的放大图片的链接地址,以根据链接地址获取对应的放大图片,具体实现中,链接地址可以从对应的详情页面中获取。
[0095]本发明实施例中,优选地,所述搜索结果还包括展示所述搜索结果的详情页面的页面标题、页面站点名称以及页面域名,还可以包括其他关键信息。
[0096]相应的,所述创建展示所述放大图片的第一页面浮层,并覆盖在所述移动搜索客户端的当前页面上为,创建展示所述放大图片、所述页面标题、图片摘要数据、页面站点名称以及页面域名的第一页面浮层,并覆盖在所述移动搜索客户端的当前页面上。
[0097]参照图2,示出了本发明实施例二的一种移动终端搜索图片的预览方法的步骤流程图。
[0098]步骤201,接收用户在移动搜索客户端上提交的搜索请求。
[0099]步骤202,获取匹配所述搜索请求的包括对应详情页面的多个缩略图片的搜索结果,并对所述多个缩略图片进行展示。
[0100]步骤203,接收用户对某个缩略图片的访问操作,提取针对所述缩略图片的放大图片。
[0101]步骤204,创建展示所述放大图片的第一页面浮层,并覆盖在所述移动搜索客户端的当前页面上。
[0102]与上个实施例区别的是,本实施例中,在所述接收用户对所述缩略图片的访问操作,提取针对所述缩略图片的放大图片之后,还可以预先提取下一个可能访问的放大图片的链接地址,如图2所示还可以包括步骤205。
[0103]步骤205,提取在所述详情页面中与当前展示的放大图片相邻的放大图片的链接地址保存在所述移动搜索客户端。
[0104]本发明实施例中,在访问其中一张缩略图片后,可以预先提取相邻的放大图片的链接地址保存于移动搜索客户端,当用户需要查看下一张图片时,可以从本地提取链接地址直接获取图片,相比于临时提取链接地址的方案,可以更快速展示图片。
[0105]在具体的实现中,还可以预先根据链接地址进一步提取对应的放大图片保存在移动搜索客户端,以实现更快速地翻看图片。
[0106]步骤206,接收用户在当前展示的放大图片上的滑动操作或在所述第一页面浮层的第一预设区域的点击操作。
[0107]用户可以通过在当前放大图片上滑动,例如,向左滑动查看上一张放大图片,向右滑动查看下一张放大图片;也可以通过点击预设区域来查看上一张放大图片或是下一张放大图片,例如,点击放大图片的左侧来查看上一张放大图片,点击放大图片的右侧来查看下一张放大图片,本发明对此并不做限制。
[0108]步骤207,访问所述移动搜索客户端预先保存的链接地址,提取与当前展示的放大图片相邻的放大图片进行展示。
[0109]进一步根据预先保存的链接地址可以提取对应的图片进行展示。
[0110]步骤208,在确定当前展示的放大图片对应的缩略图片为多个缩略图片中最后一张时,在所述第一页面浮层上生成提示最后一张的信息。
[0111]可以对最后一张图片添加特殊标识,当查看图片时,根据标识判断已经到最后一张,则可以生成提示。
[0112]步骤209,创建所述第一页面浮层的预设时间段后或接收到在所述第一页面浮层的第二预设区域的点击操作。
[0113]步骤210,在所述第一页面浮层中加载第二页面浮层,所述第二页面浮
当前第2页1 2 3 4 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1