如何使用數字滾動組件？

一、什麼是數字滾動組件？

數字滾動組件是一個在頁面加載到當前位置時數字不斷滾動增加展示效果的模塊，一直滾動增加到顯示最終顯示的數字時靜止。

數字滾動組件適用於網頁上任何需要展示數字的地方，比如用真實的數字展示公司的實力，比如我是一家軟件型公司，我可以用如下形式展示：118700 開發者、141100 代碼行、16707400 下載量，實現頁面的動態交互

【應用示例】

二、如何使用數字滾動組件？

1、如何查看數字滾動組件是否已經存在？

如果你的頁面上已經有這個組件了，就不需要再添加，直接根據需要進行相關操作就可以（具體操作見下文所述）；

如果你的頁面上需要這個組件，但是還沒有添加，就需要先添加這個組件了.

2、如何添加數字滾動組件？

在頁面上添加組件的方法都是一樣的

添加的組件名稱為“數字滾動”，如下圖所示：

3、如何設置數字滾動組件？

3.1 進入組件的“設置”分兩種場景

1）此組件已經添加好的場景：進入所有這類組件設置項方法都是一樣的。

2）新添加的組件的場景：在添加此組件時會彈出這個組件的的設置話框。

3.2在組件的設置中可以設置組件展示的內容

輸入數字：在此輸入顯示在頁面上的數字；

輸入單位：在此輸入顯示在數字旁邊的文字，比如單位等；

3.3在組件的設置中可以設置組件展示的風格

選擇展示樣式：單擊“風格”切換到風格標籤，灰色方塊為顯示文字的位置，UNIT為顯示單位的位置；

設置數字樣式，具體設置內容如下：

字體大小：拖動小按鈕可以調整數字文字字號；

字體顏色：單擊下拉小箭頭可以選擇數字字體顏色；

背景顏色：單擊下拉小箭頭可以選擇數字的背景顏色；

設置單位樣式，具體設置內容如下：

字體大小：拖動小按鈕可以調整單位文字字號；

字體顏色：單擊下拉小箭頭可以選擇單位字體顏色；

背景顏色：單擊下拉小箭頭可以選擇單位的背景顏色；

3.4 保存組件設置的內容或風格

設置好數字滾動組件的內容和風格後，單擊設置框右下方的“保存”按鈕，以保存所設置的內容。

4、保存、預覽、發布

設置好以上內容以後要單擊頁面右上角的“保存”按鈕，目的是把此修改保存到網站後台；

然後可以單擊“預覽”按鈕查看不同終端下展示的效果，如果不合適可以到後台再做修改；

如果需要讓訪客也看到，請單擊頁面右上角的“發布”按鈕，發布之後稍等兩分鐘左右即可看網站前台展示效果。