网络电视嵌入式浏览器下的页面动感效果的实现方法技术

技术编号:3588476 阅读:178 留言:0更新日期:2012-04-11 18:40
本发明专利技术公开了一种网络电视嵌入式浏览器下的页面动感效果的实现方法,步骤包括:在模版中定义用户动作或者页面位置的触发条件;当焦点在页面上移动时,通过嵌入式浏览器所提供的脚本功能捕捉所述焦点的用户动作或者页面位置;当所述用户动作满足所述触发条件时,更改页面链接的图片;或者,当所述焦点的页面位置满足所述触发条件时,进行翻页操作。本发明专利技术利用IPTV嵌入式浏览器实现了页面动感效果,当用户浏览和操作EPG页面时,使EPG页面能够展示给用户动感效果。

【技术实现步骤摘要】

本专利技术涉及一种本专利技术涉及一种IPTV中基于嵌入式浏览器的EPG (Electronic program guide,电子节目指南)页面的展示才支术,具体i兌,涉 及一种。
技术介绍
随着网络电视(IPTV)走进千家万户,使更多的人体验到宽带带来的 乐趣,使人们的生活质量得到提高。IPTV系统中音频视频解码技术、流媒 体传送技术、宽带接入网络技术、IP机顶盒技术都得到了快速的发展。而由于受制于IPTV终端展示中所使用的嵌入式浏览器的一些先天缺 陷,例如,浏览器支持的WEB特性相对较弱, 一般只是支持有限的超文本 置标语言(HTML, Hyper Text Markup Language )和功能非常有限的脚本语 言,且页面之间的迁移关系往往不同于普通PC上的有鼠标配合的浏览器的 展示,从而导致了直接面对客户的IPTV的用户界面展示不能像普通PC机 上的浏览器那样展示具有动画(FLASH)特效的页面,从而使页面的美观性 大打折扣,并且只能实现简单的页面切换。展现给终端用户的EPG界面如果能够美观、动感并且多样化,将会大 大提高用户视觉上的沖击和愉悦性,而 一个枯燥单调的页面则会大大降低用 户页面操作的兴趣,甚至可能影响用户对IPTV的兴趣
技术实现思路
本专利技术所解决的技术问题是提供一种网络电视嵌入式浏览器下的页面 动感效果的实现方法,能够使使EPG页面展示动感效果。技术方案如下一种,步骤包括(1) 在模版中定义用户动作或者页面位置的触发条件;(2) 当焦点在页面上移动时,通过嵌入式浏览器所提供的脚本功能捕 捉所述焦点的用户动作或者页面位置;(3) 当所述用户动作满足所述触发条件时,更改页面链接的图片;或 者,当所述焦点的页面位置满足所述触发条件时,进行翻页操作。进一步,步骤(l)中,在所述模版的JS函数中定义所述触发条件。进一步,步骤(3)中,在JS函数中,通过获取用户触发的页面元素的 编号来获取所述页面元素的实体,再通过修改所述实体的属性来实时更改页 面链接的图片。进一步,步骤(l)中,网络电视的模版中,界面链接响应的所述用户 动作的动作状态包括获取焦点、失去焦点、点击状态,在页面中定义动作状 态触发的JS函数,在所述JS函数中判断用户的触发动作。进一步,步骤(3)中,判断所述动作状态,当所述动作状态为获取焦 点时,更换为获取焦点时的图片;当所述动作状态为失去焦点时,更换为失 去焦点时的图片;当所述动作状态为点击状态时,更换为点击焦点时的图片。进一步,步骤(1)中,在模版的JS函数中,自定义JS函数,取代默 认的机顶盒按键处理。进一步,步骤(2)中,当焦点移动时,调用所述自定义的JS函数, 在所述自定义JS函数中,调用所述机顶盒所提供的按键截获接口截获遥控 器的按键操作,用所述自定义JS函数取代默认的机顶盒按键处理。进一步,步骤(3)中,在JS函数中,判断所述焦点的位置是否在表格 的边沿元素上;如果是则强行触发页面的翻页操作,否则,调用默认的机顶 盒按键处理。本专利技术利用IPTV嵌入式浏览器实现了页面动感效果,当用户浏览和操 作EPG页面时,使EPG页面能够展示给用户动感效果。本专利技术通过嵌入式 浏览器所提供的有限的脚本功能捕捉用户的动作,根据不同的动作,更换不 同的按钮图片来实现简单的FLASH特效,很好地开发出美观、动感、交互 性强的页面。通过本专利技术技术方案,可以实现EPG页面展示时的FLASH动感效果 和扩展用户对页面的特殊操作方式,从而大大提高了页面的可观赏性和可扩 展性,打破了 EPG页面固有的展示方式。附图说明图1是EPG模版框架示意图;图2、通过图片更迭实现FLASH效果的流程图;图3、通过捕捉焦点位置实现页面自动跳转的流程图;图4、利用按键截获技术实现首页迷你菜单用例流程图。具体实施方式IPTV的模版为运行于web服务器上的web应用程序,是由Java服务 器页面(JSP , Java Server Page)、图片文件、模版配置文件所组成的。客 户端运行于嵌入式的浏览器中。模版客户端的JSP展示与一般PC机上的网 页展示有很大的区别,模版一般通过机顶盒展示于电视机或类似的播放媒介 上,界面展示直观、清晰、简洁、大方,用户的操作是通过机顶盒遥控器来 控制的,所以页面展示元素要求比较大。下面参照附图,对本专利技术的优选实施例做详细描述。参照图l所示,对EPG模版框架做详细描述。其中机顶盒用于展示IPTV的JSP页面,模版是为IPTV用户提供交互 界面的web应用程序,EPG后台提供模版访问数据库的后台接口, EPG后 台数据库为运行在web服务器上的本地数据库,用于存放IPTV业务的部分 数据。CDN为IPTV的内容分发网络,负责IPTV播放内容及部分业务数据 的管理。接口机负责IPTV系统与其他系统的对接。Portal为展示和操作IPTV 业务数据的web服务器。参照图2所示,对通过图片更迭实现FLASH效果做详细描述。FLASH的动态效果的基本原理也是通过大量图片的更迭来实现的,本 实施例中,通过捕捉用户焦点动作进行图片更迭和图片更换,实现基本 FLASH特效。步骤S201,在模版中定义用户动作的触发条件。IPTV的模版中,界面链接响应的用户动作一般有三种操作类型(动作 状态),包括获取焦点、失去焦点、点击状态。在页面中定义这三种状态 触发的JS函数(Java Script函数),在该JS函数中判断用户的触发动作。步骤S202,用户在页面上移动焦点。步骤S203,通过嵌入式浏览器所提供的有限的脚本功能捕捉用户焦点 的动作(OnFocus、 OnBlur)。步骤S204,判断用户动作的操作类型,当用户动作满足触发条件时, 执行用户动作。获取用户触发的页面元素id,通常为img标签的id,通过该id获耳又该 元素的实体,再通过修改实体的属性(通常为img标签的src属性)则可以 实时更改页面链接的图片,更改的效果可以实时展示在界面上,从而可以起 到FLASH效果。id是页面元素的编号,在一个页面中是唯一的。当用户动作的操作类型为获取焦点时,执行步骤S205;当用户动作的 操作类型为失去焦点时,执行步骤S206;当用户动作的操作类型为点击状 态时,执行步骤S207。步骤S205,当用户动作的操作类型为获取焦点时,更换为获取焦点时 的图片。步骤S206,当用户动作的操作类型为失去焦点时,更换为失去焦点时 的图片。步骤S207,当用户动作的操作类型为点击状态时,更换为点击焦点时 的图片。参照图3所示,对通过捕捉焦点位置实现页面自动跳转的过程做详细描述。本实施例中,利用嵌入式浏览器所提供的脚本捕捉用户焦点的位置来实现页面展示内容的自动翻页。步骤S301,截获用户的上、下、左、右键操作。在模版的JS函数中,调用机顶盒所提供的按键截获接口截获用户对遥 控器的上、下、左、右键操作(该功能应用于EPG后台,获取的内容通过 TABLE (HTML语言中的表格)形式展示),当用户移动焦点时则会调用 页面自定义的JS函数。步骤S302,用户自定义JS函数取代默认的机顶盒按键处理。步骤S303,获取用户焦点当前所在的页面位置。通常展示内容的翻页必须手动触发上一页、下一页按钮来实现, 而本实施例中,通过捕捉用户本文档来自技高网...

【技术保护点】
一种网络电视嵌入式浏览器下的页面动感效果的实现方法,步骤包括:    (1)在模版中定义用户动作或者页面位置的触发条件;    (2)当焦点在页面上移动时,通过嵌入式浏览器所提供的脚本功能捕捉所述焦点的用户动作或者页面位置;    (3)当所述用户动作满足所述触发条件时,更改页面链接的图片;或者,当所述焦点的页面位置满足所述触发条件时,进行翻页操作。

【技术特征摘要】
1、一种网络电视嵌入式浏览器下的页面动感效果的实现方法,步骤包括(1)在模版中定义用户动作或者页面位置的触发条件;(2)当焦点在页面上移动时,通过嵌入式浏览器所提供的脚本功能捕捉所述焦点的用户动作或者页面位置;(3)当所述用户动作满足所述触发条件时,更改页面链接的图片;或者,当所述焦点的页面位置满足所述触发条件时,进行翻页操作。2、 根据权利要求1所述的网络电视嵌入式浏览器下的页面动感效果的 实现方法,其特征在于,步骤(l)中,在所述模版的JS函数中定义所述触 发条件。3、 根据权利要求2所述的网络电视嵌入式浏览器下的页面动感效果的 实现方法,其特征在于,步骤(3)中,在JS函数中,通过获取用户触发的 页面元素的编号来获取所述页面元素的实体,再通过修改所述实体的属性来 实时更改页面《连《接的图片。4、 根据权利要求1所述的网络电视嵌入式浏览器下的页面动感效果的 实现方法,其特征在于,步骤(l)中,网络电视的模版中,界面链接响应 的所述用户动作的动作状态包括获取焦点、失去焦点、点击状态,在页面中 定义动作状态触发的JS函数,在所述JS函数中判断用...

【专利技术属性】
技术研发人员:任建华朱兴昌刘学安
申请(专利权)人:中兴通讯股份有限公司
类型:发明
国别省市:94[中国|深圳]

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1