CN1529262A - 网页在线浏览显示的实现方法 - Google Patents

Abstract

一种网页在线浏览显示的实现方法，将网络浏览器所能识别的大图切割为若干个小图，并将小图上传到网页服务器；同时根据大图生成缩略图，上传到网页服务器；用户端通过网络浏览器访问缩略图，并通过鼠标在缩略图上选择确认所要浏览的区域；网页服务器根据用户端所选择的缩略图区域在整个缩略图的坐标位置及区域的范围，调用该区域对应的小图进行放大显示。利用本发明，浏览者在进行网页浏览时非常方便，不但可以看到原汁原味的报刊杂志的网络版本，而且页面下载效率高，网页显示快，不需要下载辅助软件，直接使用一般的浏览器即可进行阅读，用户没有阅读屏障，而且操作十方方便。

Description

网页在线浏览显示的实现方法

技术领域

本发明涉及网络技术，尤其涉及一种网页在线浏览显示的实现方法。

背景技术

互联网的兴起虽然时间不长，但它对于传统社会所造成的影响却已非常之大，报纸、电视、广播传统媒体也因此受到强烈冲击。网络新闻以其速度快、信息全等优势迅速成为许多人的选择，新闻也因此成为最受欢迎和关注的网站内容，上网看新闻成为一种时尚。

当前各大报社和杂志社等出版单位纷纷建立自己的媒体网站，一般通过HTML语言将印刷版媒体的主要信息发布在网上，形成简单的网络版，供读者免费浏览，吸引读者的访问，提高点击率，以达到促进报刊发行、定购，为读者提供服务，进行编读交流，以及进行广告客户、在线调查、获取新闻线索等信息服务。

现有的媒体网站一般采用文字网页发布他们的报纸和杂志，这种方法已将报纸和杂志内容的格式改变，与报纸相比已经不能直观地显示经过精心设计的报纸或杂志的版面，降低了读者阅读的兴趣，而且HTML页面中经常出现信息的不一致性，如不同平台，不同浏览器，不同尺寸的浏览器窗口看到的同一WEB页面呈现出不同样子。而且采用文字方式发布信息，增加了很大的工作量，由于报刊杂志的信息内容比较丰富，一般只将主要信息发布在网站上。

PDF是可携式文件格式，它的文件可以在网络上传输、浏览，甚至使用印表机印出，或使用其它输出装置输出，都可以保存原来的文字及图片的编排。采用阅读软件如Acrobat Reader进行浏览，它与平台无关的，包含了字体、图表及图像等。PDF文件使用了工业标准的压缩算法，文件比较小，易于传输与储存。正是由于PDF文件的种种优点，它逐渐成为出版业中的新宠。

近年来，一些媒体网站将PDF格式纳入自己的网站，利用其平台推出自己的PDF版报刊。普通读者对于PDF的日渐熟悉，也推动着报刊媒体网站将PDF格式与网页格式有机结合在一起，以更多样化的方式展现自己的面貌。提供PDF版的报纸供读者在网上浏览，可将全部版面的信息全部呈现，或将信息采用PDF格式与HTML格式两种版式同时发布，供读者选择。在发布时，首先将报刊印刷出版的文件格式，如PS(PostScript，即页面描述语言)文件格式，转换为PDF格式，再发布到网站上。

PDF文档格式能够图文并茂地呈现报刊的原版原式，能让读者看到原汁原味的印刷版原貌。读者进入网站后，选择版面，可以选择整版版面放大，以便看清文字，也可用鼠标直接在版面上拖拉出自己想看的区域放大进行阅读。但采用PDF版，需要读者用户安装Acrobat Reader等辅助性的阅读软件，才能实现浏览显示。对不熟悉软件的读者用户来说，存在着阅读屏障，增加了用户使用的难度。而且如果网站提供阅读软件下载，需要先激活如Acrobat Reader，再下载完整的PDF版面在线浏览，需要较长的时间，降低了网络的运行速度，浪费了用户的时间，这样用户很难有耐性继续进行阅读。而且现有的阅读软件操作比较麻烦，常常会将整版面放得很大在网页上狭窄的平面进行显示，然后又缩小，阅读起来操作比较费劲。

发明内容

本发明所要解决的技术问题是：克服现有的网上报刊出版物浏览不方便的不足，提供一种进行网上在线浏览显示的实现方法，不但操作简便、速度快，而且保留刊物的原汁原味，从而方便读者的网上浏览。

本发明为解决上述技术问题所采用的技术方案为：

这种网页在线浏览显示的实现方法，包括以下步骤：

A、将网络浏览器所能识别的大图切割为若干个小图，并将所述的小图上传到网页服务器；同时根据大图生成缩略图，上传到网页服务器；

B、用户端通过网络浏览器访问所述的缩略图，并通过鼠标在缩略图上选择确认所要浏览的区域；

C、网页服务器根据用户端所选择的缩略图区域在整个缩略图的坐标位置及区域的范围，调用该区域对应的小图进行放大显示。

对于网络浏览器不能识别的图片格式，先将该图片转换为网络浏览器所能识别的格式，再切割成小图。

将图片切割为小图时，先利用切割图片软件打开模板文件，然后输入待切割的图片文件，按模板文件所设定的格式将图片切割为大小相同的小图，切割完后输出切割小的图片文件。

所述的步骤B中，用户端通过鼠标在缩略图上利用方框选择所要浏览的区域，服务器端获取方框的起点坐标，及方框的宽和高，确定所要浏览的区域范围。

所述的步骤C中，网页服务器处理过程如下：

a1、网页服务器根据预先设定的缩略图的大小，获取缩略图的宽度和高度；

a2、分别获取所述大图中每行和每列所切割的小图个数；

a3、根据缩略图的宽度和高度，以及每行和每列所切割的小图个数，获得每个小图在缩略图中所显示的宽度和高度；

a4、根据所述方框的起点坐标和方框的宽度和高度，获取该方框区域所对应的小图；

a5、调用该区域所对应的小图，弹出新的浏览器窗口对所述小图进行放大显示。

所述新的浏览器窗口中，当鼠标按下时，服务器端获取当前窗口坐标，并判断鼠标是否按住不动，如果是，则当鼠标拖动时，根据鼠标拖动方向，移动当前显示窗口。

所述的浏览器页面上，在缩略图周围还设置有不同图片的链接标识或翻页标识，所述的链接标识或翻页标识链接到相应的缩略图片，当用户端选择所述的链接标识或翻页标识时，浏览器显示对应的缩略图。

所述的链接标识或翻页标识设置于浏览器页面上某个选择标识所对应的下拉框中。

本发明的有益效果为：利用本发明，浏览者在进行网页浏览时非常方便，不但可以看到原汁原味的报刊杂志的网络版本，而且页面下载效率高，网页显示快，不需要下载辅助软件，直接使用一般的浏览器即可进行阅读，用户没有阅读屏障，而且操作十方方便，就如同手握一份报纸一样，当需要阅读感兴趣的部分时，直接拖动鼠标进行框选放大，在新的浏览器窗口进行放大显示，在该窗口可进行平移，看完后选择其它的部分继续阅读，操作方式简便易懂。在选择报纸的版面时，可以点击页面上的链接标识，进入该版面进行阅读或直接通过翻页标识，一页一页地阅读。本发明以一般人阅读报纸杂志的视觉移动方式为基础，仿真了真实的阅读经验，保留了传统阅读印刷书刊的趣味。

本发明可兼容目前各种印刷系统，直接将需印刷的报刊在印刷的同时，输出到网站上，不需进行重新编排，节省了人力物力，可进行网上发报而不受语言限制，兼容性好。利用本发明，可在网上及时发布报纸杂志信息，进行在线电子出版物和杂志的出版，使报刊与读者没有时间和空间的距离。

附图说明

图1为本发明图片预处理流程图；

图2为本发明图片切割处理流程图；

图3为本发明图片上传示意图；

图4为本发明图片阅读显示流程图；

图5为本发明鼠标坐标获取流程图；

图6为本发明显示处理实现流程图；

图7为本发明窗口平移处理流程图；

图8为本发明报纸向前翻页处理流程图；

图9为本发明报纸向后翻页处理流程图。

具体实施方式

下面根据附图和实施例对本发明作进一步详细说明：

本发明提供一种进行网上在线浏览显示的实现方法，方便网上报纸杂志等的浏览阅读。如图1所示，在通过出版软件(如方正出版系统)出版报纸的同时，将排版输出的PS(PostScript，即页面描述语言)文件格式，转换为网络浏览器，如Internet Explorer浏览器，所能识别的格式，如JPG、GIF、BMP等格式，这些经转换格式的图片显示内容与报纸样式相同。对于网络浏览器不能识别的图片格式，先将图片转换为网络浏览器所能识别的格式，对于网络浏览器能识别的图片格式则不需进行转换。然后将这些图片根据需要生成预定大小的预览缩略图，同时通过Photoshop或Firework等绘图软件将图片切割成相同大小的小图。

图片切割就是把一张完整的图片剪裁成数张小图，这样做虽然图片总容量没有多大的变化，但是缩短了网页的下载时间。一般来说，将一张图片切割为多块之后，不仅会使整体的传输时间减少，而且当其他人看见图片一部分一部分的显示出来，也不会感觉到网络传输很慢，也不会觉得页面上的图片太大了。如图2所示，将图片切割为小图时，先利用切割图片软件打开模板文件，然后输入待切割的图片文件，按模板文件所设定的格式将图片切割为大小相同的小图，切割完后输出切割小的图片文件，并删除先前未切割的大图，完成所有版面的切割后，不保存模块退出程序，以便下次利用该模块进行同样的切割。

如图3所示，通过FTP(文件传输协议)上传软件将预览缩略图和小图在网上发布，上传到网页服务器，保存在网页服务器相应的文件夹中，这样就可直观地在网上显示出与报纸版面一样的缩略图。

如图4所示，用户端通过网络浏览器访问所述的缩略图，并通过鼠标在缩略图上选择确认所要浏览的区域，可利用方框进行选择，用户端框选后，调用鼠标坐标算法，利用鼠标坐标算法计算出框选部分相对于网页的坐标位置，此算法相当重要，是调用后续图片显示算法必要条件。

如图5所示，鼠标坐标算法首先获取浏览者在网页上方框左顶点相对于页面坐标，及方框的宽和高，这些是图片显示算法的重要参数，确定所要浏览的区域范围。

在所框选的区域内，鼠标变为放大镜的形状，当用户点击放大镜确定进行浏览时，网页服务器调用图片显示算法显示该区域对应的小图，如图6所示，图片显示处理过程如下：

1、网页服务器根据预先设定的缩略图的大小，获取缩略图的宽度和高度；

2、分别获取所述大图中每行和每列所切割的小图个数；

3、根据缩略图的宽度和高度，以及每行和每列所切割的小图个数，计算出每个小图在缩略图中所显示的宽度和高度；

4、根据所述方框的起点坐标和方框的宽度和高度，获取该方框区域所对应的小图；

5、调用该区域所对应的小图，弹出新的浏览器窗口对所述小图进行放大显示，显示的图片是由这些小图按一定的排列显示出来的。

如图7所示，新的浏览器窗口中，鼠标显示为手形，当鼠标按下时，服务器端获取当前窗口坐标，并判断鼠标是否按住不动，如果是，则当鼠标拖动时，根据鼠标拖动方向，移动当前显示窗口，直至鼠标松开。

浏览器页面上，在缩略图周围还设置有不同图片的链接标识或翻页标识，这些链接标识(如版面A1、A2、B1、B2等)或翻页标识(如左、右箭头)链接到相应的缩略图片，当用户端选择所述的链接标识或翻页标识时，浏览器显示对应的缩略图。这些链接标识或翻页标识也可设置于浏览器页面上某个选择标识所对应的下拉框中。

如图8所示，当对报纸进行浏览，向前翻页时，服务端计算版面数目，然后分别获取当前版面名称的第一个字母，以及版面名称中的数字，判断当前页是否为该版第一页，如果是，则跳到上一版第一页，如果不是，则跳到该版上一页。

如图9所示，当对报纸进行浏览，向后翻页时，服务端计算版面数目，然后分别获取当前版面名称的第一个字母，以及版面名称中的数字，判断当前页是否为该版最后一页，如果是，则跳到下一版第一页，如果不是，则跳到该版下一页。

这样，浏览者在进行网页浏览时非常方便，不但可以看到原汁原味的报刊杂志的网络版本，而且页面下载效率高，网页显示快，不需要下载辅助软件，直接使用一般的浏览器即可进行阅读，用户没有阅读屏障，而且操作十方方便，就如同手握一份报纸一样。当需要阅读感兴趣的部分时，直接拖动鼠标进行框选放大，在新的浏览器窗口进行放大显示，在该窗口可进行平移，看完后选择其它的部分继续阅读，操作方式简便易懂。在选择报纸的版面时，可以点击页面上的链接标识，进入该版面进行阅读或直接通过翻页标识，一页一页地阅读。本发明以一般人阅读报纸杂志的视觉移动方式为基础，仿真了真实的阅读经验，保留了传统阅读印刷书刊的趣味。

虽然本发明以较佳实施例披露如上，但是其并非用以限定本发明，任何本领域的技术人员，在不脱离本发明的精神和范围内，可对本发明技术方案进行适当变化，所附的权利要求包括这些变化，本发明的保护范围以所附的权利要求为准。

Claims (8)

1、一种网页在线浏览显示的实现方法，其特征在于，包括以下步骤：

A、将网络浏览器所能识别的大图切割为若干个小图，并将所述的小图上传到网页服务器；同时根据大图生成缩略图，上传到网页服务器；

B、用户端通过网络浏览器访问所述的缩略图，并通过鼠标在缩略图上选择确认所要浏览的区域；

C、网页服务器根据用户端所选择的缩略图区域在整个缩略图的坐标位置及区域的范围，调用该区域对应的小图进行放大显示。

2、根据权利要求1所述的网页在线浏览显示的实现方法，其特征在于：对于网络浏览器不能识别的图片格式，先将该图片转换为网络浏览器所能识别的格式，再切割成小图。

3、根据权利要求1或2所述的网页在线浏览显示的实现方法，其特征在于：将图片切割为小图时，先利用切割图片软件打开模板文件，然后输入待切割的图片文件，按模板文件所设定的格式将图片切割为大小相同的小图，切割完后输出切割小的图片文件。

4、根据权利要求1或2所述的网页在线浏览显示的实现方法，其特征在于：所述的步骤B中，用户端通过鼠标在缩略图上利用方框选择所要浏览的区域，服务器端获取方框的起点坐标，及方框的宽和高，确定所要浏览的区域范围。

5、根据权利要求4所述的网页在线浏览显示的实现方法，其特征在于：所述的步骤C中，网页服务器处理过程如下：

a1、网页服务器根据预先设定的缩略图的大小，获取缩略图的宽度和高度；

a2、分别获取所述大图中每行和每列所切割的小图个数；

a3、根据缩略图的宽度和高度，以及每行和每列所切割的小图个数，获得每个小图在缩略图中所显示的宽度和高度；

a4、根据所述方框的起点坐标和方框的宽度和高度，获取该方框区域所对应的小图；

a5、调用该区域所对应的小图，弹出新的浏览器窗口对所述小图进行放大显示。

6、根据权利要求5所述的网页在线浏览显示的实现方法，其特征在于：所述新的浏览器窗口中，当鼠标按下时，服务器端获取当前窗口坐标，并判断鼠标是否按住不动，如果是，则当鼠标拖动时，根据鼠标拖动方向，移动当前显示窗口。

7、根据权利要求5所述的网页在线浏览显示的实现方法，其特征在于：所述的浏览器页面上，在编略图周围还设置有不同图片的链接标识或翻页标识，所述的链接标识或翻页标识链接到相应的缩略图片，当用户端选择所述的链接标识或翻页标识时，浏览器显示对应的缩略图。

8、根据权利要求7所述的网页在线浏览显示的实现方法，其特征在于：所述的链接标识或翻页标识设置于浏览器页面上某个选择标识所对应的下拉框中。

Images