一种在网页中动态改变层的实现方法技术

本发明专利技术公开了一种在网页中动态改变层的实现方法，用于在具有信息处理能力的装置中控制网页的页面展示效果；该步骤方法由装置中的处理器读取包含超文本标记性语言（ＨＴＭＬ）文件生成网页并展示，其中该文件包含有用于定义网页中层的属性的标签；捕获用户在所述网页的层上所触发的操作事件，并实时计算出层属性的当前值；将层属性的当前值传递给所述标签中对应的属性，并在展示的网页中反映层的属性改变后的效果。

【技术实现步骤摘要】

本专利技术涉及计算机及通信
，尤其涉及。
技术介绍
随着互联网的迅速发展，网站的展示方式也日新月异，其中网页的展示方式更是层出不穷。一般情况下，网页的展示是基于超文本标记性语言(HTML语言)实现的，HTML中的div标签是渲染HTML元素的一种容器，常用作为网页中的层，可以展示更丰富的效果。在网页设计中，经常会用超文本标记性语言(HTML语言)中的标签(即<div></div>标签，或称div标签)对其中的HTML元素进行渲染，从而实现更好的展示效果。目前在设计网页过程中，都只是对div标签进行简单的增加、删除，以及对其可见性显示与否做出动态或静态的选择，而且大多情况下层的长宽都是固定的，不能动态的改变；另外，多数情况下也没有使用层的样式或者仅固定层的样式，不仅样式单一，而且也不能动态的改变。
技术实现思路
本专利技术提供，用以解决现有技术在展示网页时存在不能动态改变层的展示效果的问题。为解决上述问题，本专利技术提供以下技术方案一种动态改变网页中的层的方法，用于在具有信息处理能力的装置中控制网页的页面效果；包括如下步骤所述装置中的处理器读取包含超文本标记性语言(HTML)文件生成网页并展示，其中该文件包含有用于定义网页中层的属性的标签； 捕获用户在所述网页的层上所触发的操作事件，并实时计算出层属性的当前值；将所述当前值传递给所述标签中对应的属性，并在展示的网页中反映层的属性改变后的效果。根据上述方法在所述HTML文件中定义一个用于识别所述标签的标识，在传递当前值时通过该标识定位到相应的属性。通过给参数赋值的方式传送所述当前值，或者，通过直接修改所述标签中的属性值的方式传递当前值。所述属性至少包括层的位置属性、层的大小属性和层的样式属性之一。所述属性包括层的样式属性时，在网页上提供一个可选择层样式的列表，该列表中的每一项对应一个用于定义层样式的层叠样式表单(CSS)文件。选择所述列表中的表项后将对应的CSS文件的路径作为层的样式属性值传递到所述标签。本专利技术通过实时捕获用户在网页的层上的操作并计算出层当前的属性值，然后传递给div标签中定义的层的属性，从而动态的改变层。本专利技术不仅使页面展示效果更具有灵活性，而且也增强了用户的交互感和对用户的吸引力。附图说明图1为本专利技术中动态改变网页中层的位置、大小的流程图；图2为本专利技术中动态改变网页中层的样式的流程图。具体实施例方式在计算机等具有信息处理能力的装置中用HTML语言定义完网页后，由处理器读取HTML文件并通过解释文件中的语句来最终展示页面。为了能够动态的改变网页中的层，本专利技术通过在定义网页的HTML文件中用标签定义网页中层的属性，实时捕获用户在所述网页的层上所触发的操作事件，并实时计算出层属性的当前值；将该当前值传递给所述标签中对应的属性并在展示的网页中反映层的属性改变后的效果。实施例一本实施例以动态改变层的位置和大小为例进行详细说明在定义网页的HTML文件中增加用于定义层的<div></div>标签，(也可以使用其他标识答，如<span></span>标签)在这个标签中用HTML语言定义层的大小和位置属性，初始时可以给这些属性赋默认值。为了能够区别该标签与其他用途的标签，给该<div></div>标签定义一个唯一标识ID，即通过该ID能够定位到文件中对应的标签。为了能够对文件中定义的层的属性值进行操作，在捕获到网页上的层被改变时，根据ID标识定位文件中定义层的div></div>标签，然后将改变后的属性值传递到该标签中对应的属性。对于层的动态移动当页面产生后，用户的鼠标滑到层上触发事件onMouseOver()，这时当鼠标按下(onMouseDonw())，系统进入计算状态，当用户拖拽实时系统根据鼠标的位置(x，y)坐标值计算出层的位置(Left，Top)的值；当用户停止拖拽并松开鼠标时(onMouseUP())，系统离开计算状态。对于层的动态放缩当页面产生后，用户的鼠标滑到层的四周的边缘上触发事件onMouseOver()，这时当鼠标按下(onMouseDonw())，系统进入计算状态；当用户拖拽实时系统根据滑鼠的位置(x，y)的坐标值，然后计算出层的长宽(Width，Height)；当用户停止拖拽并松开鼠标时(onMouseUP())系统离开计算状态。参阅图1所示，动态改变网页中层的位置、大小的处理过程如下步骤1、计算装置中的处理器读取并解释HTML文件，在显示装置上产生网页页面。步骤2、用户的鼠标滑到层上触发事件onMouseOver()，系统捕获对页面所进行的操作，如移动，拖拽等，并根据鼠标的位置(x，y)坐标值，实时地计算出层当前的位置(Left，Top)的值或长宽(Width，Height)的值。步骤3、根据标识ID定位到HTML文件中的定义层的<div></div>标签，将计算出的当前值传递到该标签中定义的属性。传递属性值的可以采用给参数赋值的方式传递，也可以通过直接修改所述标签中的属性值的方式传递。步骤4、在鼠标采样值动态改变时，在该页面中反映层计算后的属性值，即展示层的属性改变后的效果。根据实际需要，可以仅实现层位置的动态变化或大小的动态变化，也可以同时实现层位置和大小的动态变化。实施例二本实施例以动态改变层的样式为例进行详细说明将网页中层所需要的样式设计素材定义到一个层叠样式表单(CascadingStyle Sheets，CSS)文件，每一种样式定义到一个CSS文件中。根据需要可定义多个CSS文件。在定义网页的HTML文件中增加用于定义层的<div></div>标签，在这个标签中用HTML语言定义层的样式，初始时可以指定一个默认样式，将该默认样式对应的CSS文件的路径和文件名赋值给属性。为了能够区别该标签与其他用途的标签，给该<div></div>标签定义一个唯一标识ID，即通过该ID能够定位到文件中对应的标签。在产生网页时，产生一个选择列表，在该列表中包含所有定义的层样式的CSS文件。当用户的鼠标滑到特定的区域时，系统自动列出选择列表中的所有选择项，用户选择自己想要的样式后，系统将文件的路径和文件名传递到HTML文件的<div></div>标签所定义的样式属性。参阅图2所示，动态改变网页中层的样式的处理过程如下 步骤101、计算装置中的处理器读取并解释HTML文件，在显示装置上产生网页页面，该页面包含一个层样式选择列表。步骤102、用户的鼠标滑到层上的特定区域时，系统列表选择列表中所有可选项，并获取用户选择的CSS文件和该CSS文件对应的路径。步骤103、根据标识ID定位到HTML文件中的定义层的div></d本文档来自技高网...

【技术保护点】
一种在网页中动态改变层的实现方法，用于在具有信息处理能力的装置中控制网页的页面展示效果；其特征在于，包括如下步骤：所述装置中的处理器读取包含超文本标记性语言（ＨＴＭＬ）文件生成网页并展示，其中该文件包含有用于定义网页中层的属性的标签 ；捕获用户在所述网页的层上所触发的操作事件，并实时计算出层属性的当前值；将所述当前值传递给所述标签中对应的属性，并在展示的网页中反映层的属性改变后的效果。

【技术特征摘要】
1.一种在网页中动态改变层的实现方法，用于在具有信息处理能力的装置中控制网页的页面展示效果；其特征在于，包括如下步骤所述装置中的处理器读取包含超文本标记性语言(HTML)文件生成网页并展示，其中该文件包含有用于定义网页中层的属性的标签；捕获用户在所述网页的层上所触发的操作事件，并实时计算出层属性的当前值；将所述当前值传递给所述标签中对应的属性，并在展示的网页中反映层的属性改变后的效果。2.如权利要求1所述的方法，其特征在于，在所述HTML文件中定义一个用于识别所述标签的标识，在传递当前值时通过该标识定位到相应的属性。3.如权...

【专利技术属性】
技术研发人员：胡振勇，张剑，林浩，林松涛，马丁，陈妍，
申请(专利权)人：腾讯科技深圳有限公司，
类型：发明
国别省市：94[中国|深圳]