如何使用数字滚动组件？

一、什么是数字滚动组件？

数字滚动组件是一个在页面加载到当前位置时数字不断滚动增加展示效果的模块，一直滚动增加到显示最终显示的数字时静止。

数字滚动组件适用于网页上任何需要展示数字的地方，比如用真实的数字展示公司的实力，比如我是一家软件型公司，我可以用如下形式展示：118700 开发者、141100 代码行、16707400 下载量，实现页面的动态交互

【应用示例】

二、如何使用数字滚动组件？

1、如何查看数字滚动组件是否已经存在？

如果你的页面上已经有这个组件了，就不需要再添加，直接根据需要进行相关操作就可以（具体操作见下文所述）；

如果你的页面上需要这个组件，但是还没有添加，就需要先添加这个组件了

2、如何添加数字滚动组件？

在页面上添加组件的方法都是一样的

添加的组件名称为“数字滚动”，如下图所示：

3、如何设置数字滚动组件？

3.1 进入组件的“设置”分两种场景

1）此组件已经添加好的场景：进入所有这类组件设置项方法都是一样的，

2）新添加的组件的场景：在添加此组件时会弹出这个组件的的设置话框。

3.2 在组件的设置中可以设置组件展示的内容

输入数字：在此输入显示在页面上的数字；

输入单位：在此输入显示在数字旁边的文字，比如单位等；

3.3 在组件的设置中可以设置组件展示的风格

选择展示样式：单击“风格”切换到风格标签，灰色方块为显示文字的位置，UNIT为显示单位的位置；

设置数字样式，具体设置内容如下：

字体大小：拖动小按钮可以调整数字文字字号；

字体颜色：单击下拉小箭头可以选择数字字体颜色；

背景颜色：单击下拉小箭头可以选择数字的背景颜色；

设置单位样式，具体设置内容如下：

字体大小：拖动小按钮可以调整单位文字字号；

字体颜色：单击下拉小箭头可以选择单位字体颜色；

背景颜色：单击下拉小箭头可以选择单位的背景颜色；

3.4 保存组件设置的内容或风格

设置好数字滚动组件的内容和风格后，单击设置框右下方的“保存”按钮，以保存所设置的内容。

4、保存、预览、发布

设置好以上内容以后要单击页面右上角的“保存”按钮，目的是把此修改保存到网站后台；

然后可以单击“预览”按钮查看不同终端下展示的效果，如果不合适可以到后台再做修改；

如果需要让访客也看到，请单击页面右上角的“发布”按钮，发布之后稍等两分钟左右即可看网站前台展示效果。

根据需要还可以对这个组件做以下操作，具体请单击以下链接了解。

5、如何编辑组件的样式？

组件的“编辑样式”功能主要可以编辑此组件的以下内容：组件背景、组件边框、组件边距、文字字号、颜色等，根据需求选择使用；

组件的“编辑样式”功能操作入口：所有组件的“编辑样式”功能操作入口都是一样的，

6、如何应用组件？

通过组件的“应用组件”功能，可以将当前页面的组件应用到其他页面上，因为原理上它们是同一个组件，所以在任何被应用到的页面上编辑/删除组件时，被应用的页面会一起变化，这个是“应用组件”和“复制组件”最本质的区别。此功能经常用于面包屑导航、产品分类组件、文章分类组件等。被应用过去的组件会出现在页面的最底端，可以用鼠标左键按住组件名称拖动到需要的位置；

组件的“应用组件”功能操作入口：所有组件的“应用组件”功能操作入口都是一样的，

7、如何删除组件？

如果确定不需要这个组件了，可以通过“删除组件”按钮把此组件删除掉，被删除的组件会默认放到组件回收站中。

组件的“删除组件”功能操作入口：所有组件的“删除组件”功能操作入口都是一样的，

8、如何恢复组件？

如果需要恢复已经删除的组件，可以到组件回收站中，找到对应的组件，然后执行【还原】操作，即可恢复此组件到原有的页面上，通常会位于页面的最底端。

恢复组件的操作入口：所有组件的恢复功能操作入口都是一样的，