基于电视的web页面焦点控制方法技术

本发明专利技术提供一种基于电视的web页面焦点控制方法，其包括：步骤1，将页面分成多个固定的区域；步骤2，采用漂浮框表示焦点的当前选择；步骤3，设置焦点与不同的独立的多个遥控悬浮选框效果处理模块的绑定；以及步骤4，当焦点在相同区域中的元素之间切换的时候，采用同样大小的边框，来回覆盖相应元素，所述多个遥控悬浮选框效果处理模块协同控制所述漂浮框的行走。本发明专利技术中的基于电视的web页面焦点控制方法，页面行走风格独特，并且由全js脚本控制，不再依赖浏览器对焦点控制方式的实现，从而全面掌握应用在用户端的展现。

【技术实现步骤摘要】

本专利技术涉及智能电视应用领域，特别是涉及到一种。
技术介绍
由于智能电视刚刚起步，在其中应用的浏览器五花八门，因此想在智能电视上发布web应用，面临着不同的浏览器标准，传统采用的页面技术往往难以逐个兼容，如果逐个做匹配，往往易限于无休止的技术黑洞，同时在页面展现的效果，也容易因此显得凌乱不堪。因此，采用一种风格一致、独立于浏览器的统一界面解决方案，对于在tv端web应用的 推广，将会带来很大帮助。在申请号为CN200810146345. 2的中国专利申请中，提出了一种网络电视业务适配方法、服务器及系统，其能够根据机顶盒的能力信息选择匹配的显示模板，并利用显示模板适配机顶盒所请求的IPTV内容，从而使得业务系统对不同软硬件能力的机顶盒采用统一的方式提供服务。但是，该专利并不是将技术难点通过面向对象的方式来解决，其为面向过程的处理方式，开发周期比较长，维护成本高。
技术实现思路
本专利技术的目的是提供一种，其可以使所有页面的焦点风格统一，且全js控制使得对浏览器的依赖大大弱化。 本专利技术的目的可通过如下技术方案来实现，所述包括步骤1，将页面分成多个固定的区域；步骤2，采用漂浮框表示焦点的当前选择；步骤3，设置焦点与不同的独立的多个遥控悬浮选框效果处理模块的绑定；以及步骤4，当焦点在相同区域中的元素之间切换的时候，采用同样大小的边框，来回覆盖相应元素，所述多个遥控悬浮选框效果处理模块协同控制所述漂浮框的行走。本专利技术的目的还可通过如下技术措施来实现 优选的是，所述多个固定的区域包括按钮区域、播放方式选择区域、集数选择区域和分页区域。优选的是，在步骤2中，采用级联样式表画出所述漂浮框，所述级联样式表为独立定义。优选的是，所述多个遥控悬浮选框效果处理模块包括第一遥控悬浮选框效果处理模块，处理WEB应用与机顶盒的相关配置开关。优选的是，所述多个遥控悬浮选框效果处理模块包括第二遥控悬浮选框效果处理模块，处理WEB应用按键。优选的是，所述多个遥控悬浮选框效果处理模块包括第三遥控悬浮选框效果处理模块，处理WEB应用浏览器的适配。优选的是，所述多个遥控悬浮选框效果处理模块包括第四遥控悬浮选框效果处理模块，处理WEB应用遥控悬浮框效果。优选的是，所述多个遥控悬浮选框效果处理模块包括第五遥控悬浮选框效果处理模块，处理WEB应用数据分页。优选的是，在步骤4中，所述漂浮框形成由所述多个遥控悬浮选框效果处理模块协同控制的行走的动画，该动画的快慢时间为预设值。优选的是，在步骤4中，当焦点在不同区域的元素之间切换的时候，所述漂浮框形成的动画在行走过程中渐进变化大小，以适应不同区域元素的大小。技术人员不难看出，上述各优选方案的任意组合所构成的方案都是本专利技术的一部分。本专利技术中的，在问题处理上引入了组的概念，将同一类别，同一目的的内容纳入同一分组，组内成员有独立的关系，组合组有独立的关 系，这种设计的优点就是大大的减少了开发中的逻辑判断。本专利技术中的，页面行走风格独特，从用户体验角度来讲，带给用户这样一种独特的体验行走的方框在电视的大屏之上灵动多变但又风格统一，可以带领用户随心所欲的聚焦到感兴趣的内容，并且由全js脚本控制，不再依赖浏览器对焦点控制方式的实现，从而全面掌握应用在用户端的展现。本专利技术中的解决了 IPTV机顶盒WEB项目应用中，浏览器适配、遥控操作、和焦点处理等解决方案不同一的问题，从而降低应用开发，维护的难度。其可以根据不同浏览器的兼容性，提供不同的显示效果；根据不同型号的机顶盒遥控器，提供统一的按键响应；根据指定的业务需求，智能选择/切换显示效果。附图说明图I为本专利技术的一优选实施例的流程 图2为应用本专利技术的的一优选实施例的浏览器页面示意图。具体实施例方式为使本专利技术的上述和其他目的、特征和优点能更明显易懂，下文特举出较佳实施例，并配合所附图式，作详细说明如下。图I为本专利技术的的一优选实施例的流程图。图2为应用本专利技术的的一优选实施例的浏览器页面示意图。在步骤101，将页面分成几个固定的区域，如图2中的返回按钮区域、播放方式选择区域、集数选择区域、以及下部的分页区域。流程进入到步骤102。在步骤102，采用一个漂浮框表示焦点的当前选择，在图2的实施例中，采用级联样式表(Cascading Style Sheet, CSS)画出漂浮框,CSS独立定义,可以根据实际效果进行不同的设置。在步骤103，设置焦点与多个不同的独立的遥控悬浮选框效果处理模块(js模块)的绑定，用于设置焦点的显示方式与不同浏览器之间的配置问题。在一实施例中，该多个不同的独立的js模块中的第一 js模块(例如，LETV. Core)用于处理WEB应用与机顶盒的相关配置开关问题。第二 js模块(例如，LETV. Keys)用于处理WEB应用按键处理问题。第三js模块(例如，LETV. Util)用与处理WEB应用浏览器适配问题。第四js模块(例如，LETV.Plate)用于处理WEB应用遥控悬浮框效果。第五js模块(例如，LETV. Page)用于处理WEB应用数据分页问题。流程进入到步骤104。在步骤104，判断焦点是否在相同区域中的元素之间切换，当焦点在相同区域中的元素之间切换时，流程进入到步骤105。当焦点在不同区域中的元素之间切换，流程进入到步骤106。在步骤105，当焦点在相同区域中的元素之间切换的时候，采用同样大小的边框，来回覆盖相应元素，且漂浮框会有一个行走的动画，控制由多个js模块协同实现，且动画的快慢时间可设置。在步骤106，当焦点在不同区域的元素之间切换的时候，漂浮框行走的动画过程中，会渐进变化大小，以适应不同区域元素的大小。 本领域技术人员在阅读了本说明书后不难理解，本专利技术的由现有技术结合而构成，这些现有技术虽然并没有事无巨细地全部一一描述，但在阅读了本说明书后本领域技术人员会知其所云。本说明书中描述了上述现有技术的结合而构成本专利技术的各个方案，本领域技术人员可以理解，这些方案的各种结合，以及构成这些方案的各个部分和/或特征的结合都属于本专利技术的方案的范畴。本领域技术人员显然可以理解的是，将上述现有技术结合起来构成本专利技术，这需要大量创造性劳动付出，是多年理论研究和大量实验的结晶。权利要求1.，其特征在于，所述包括 步骤1，将页面分成多个固定的区域； 步骤2，采用漂浮框表示焦点的当前选择； 步骤3，设置焦点与不同的独立的多个遥控悬浮选框效果处理模块的绑定；以及 步骤4，当焦点在相同区域中的元素之间切换的时候，采用同样大小的边框，来回覆盖相应元素，所述多个遥控悬浮选框效果处理模块协同控制所述漂浮框的行走。2.根据权利要求I所述的方法，其特征在于，所述多个固定的区域包括按钮区域、播放方式选择区域、集数选择区域和分页区域。3.根据权利要求I或2所述的方法，其特征在于，在步骤2中，采用级联样式表画出所述漂浮框，所述级联样式表为独立定义。4.根据权利要求1-3中任一项所述的方法，其特征在于，所述多个遥控悬浮选框效果处理模块包括第一遥控悬浮选框效果处理模块，处理WEB应用与机顶盒的相关配置开关。5.根据权利要求1-4中任一项所述的方法，其特征在于，所述多个遥控悬浮选框效果处理模块包括第二遥控悬浮选框效果处理模块，处理WEB应用按键。6.根据权利要求1本文档来自技高网...

【技术保护点】
基于电视的web页面焦点控制方法，其特征在于，所述基于电视的web页面焦点控制方法包括：步骤1，将页面分成多个固定的区域；步骤2，采用漂浮框表示焦点的当前选择；步骤3，设置焦点与不同的独立的多个遥控悬浮选框效果处理模块的绑定；以及步骤4，当焦点在相同区域中的元素之间切换的时候，采用同样大小的边框，来回覆盖相应元素，所述多个遥控悬浮选框效果处理模块协同控制所述漂浮框的行走。

【技术特征摘要】

【专利技术属性】
技术研发人员：徐维麟，白德鑫，孟大巍，姚晓鹏，
申请(专利权)人：乐视网信息技术北京股份有限公司，
类型：发明
国别省市：