网页消息滚动（网页滚动屏幕）

　　一、网页消息滚动的原理 　　网页消息滚动（crawl） ，就是指在网页中把内容（文字、图片或视频等）从窗口的底部向上滚动显示，实现消息持续不断地呈现信息的目的，以达到视觉更加丰富的效果。 　　其原理是利用 HTML 的CSS 代码快速在屏幕上自上而下实现不断滚动的动画效果。网页开发人员首先将所需显示的所有消息内容编码存放在网页的数据库中，然后在页面上利用适当的CSS 代码来调整消息在屏幕上的自上而下滚动速度显示，同时利用js 动态地提取相关数据库中的消息内容。 　　二、网页消息滚动的实现方法 　　（1）使用 HTML marquee 标签 　　marquee 标签是 HTML5 提供的一种展现消息滚动效果的最简单方式，在marquee 标签中，可以定义消息滚动的行为属性，如滚动的速度、飞跃模式、循环模式等，还可以在 marquee 标签里添加其他的 HTML 或文本内容，是实现消息滚动的简便易用的方式。 　　（2）使用 CSS 样式 　　使用 CSS 样式的实现方式很普通，例如使用 position 的 relative 或 absolute 将消息内容固定在屏幕，然后定义其滚动距离，滚动速度、定时器轮询间隔等，最终根据css 样式框架和数据库返回的消息内容实现消息滚动显示。 　　（3）使用 JavaScript 脚本 　　使用 JavaScript 脚本实现消息滚动除了上述 CSS 方式外，还可以使用 JavaScript 脚本来实现消息滚动。可以首先设置一个定时器任务，利用 getElementByID 和 innerHTML 这一类 DOM 操作函数实现，从数据库中提取所需内容，然后结合 shift 或 pop 方法，调整所取内容的顺序，最后利用 write 方法实现在屏幕上每隔固定时间显示不同的消息。 　　1. 网页消息滚动技术的本质是一种基于DIV层的动态网页技术，简单来说，就是把DIV层看作一个容器，用CSS样式设定好里面的内容，然后使用JavaScript来控制里面的元素滚动，从而让消息可以实现上下滚动的效果。 　　2. 网页消息滚动技术需要两个元素，一个是div层，另一个是表示滚动内容的内联元素（inline elements），div层用于包裹滚动内容，而滚动内容一般是内联元素（比如字符加换行），用来包裹文字，图片等。 　　3. 首先，需要使用div层将滚动框定义在指定的位置，然后设置div层的宽度和高度以及样式，使用CSS样式来定义它的overflow属性为“scroll”，以实现滚动效果。 　　4. 接下来，就是使用JavaScript来实现里面文字（或其他内容）的实时滚动，JavaScript中常用的滚动方法有ScrollHeight和ScrollBy，它们分别用来实现局部滚动和全局滚动，前者实现比较简单，后者的实现复杂一些，可以设置滚动的速度和滚动的方向。 　　5. 借助JavaScript的定时器功能，使滚动的内容可以每一定时间段进行滚动，从而让消息可以实现上下滚动的效果，不仅可以节省访问者的时间成本，而且在以容易理解的方式将信息展示出来。 　　6. 最后，可以根据需要对消息用CSS样式进行装饰，改变位置、背景图像、字体大小、字体颜色等等，达到让网页更加美观，突出消息本身所需要表达的重点。