閱讀本文以瞭解如何開始使用 Adobe Muse 的捲動效果。請閱讀以瞭解捲動效果的概念。

註解:

Adobe Muse 不再增加新功能,並將於 2020 年 3 月 26 日停止支援。如需詳細資訊和協助,請參閱 Adobe Muse 終止服務頁面

捲動效果是一種網頁設計技術,可供您設定網頁中各元素的速度和方向。透過使用捲動效果,您可以建立動態的動畫網站,其中包含兩個或多個以不同速度在瀏覽器中移動的頁面元素。Adobe Muse 可讓您進行各種設定,包括動作設定、不透明度,以及幻燈片展示或動畫的播放設定。

在 Adobe Muse 中,您幾乎可將捲動效果套用至固定網站或使用固定中斷點之網站的所有元素。這類元素包括背景影像、文字和影像。您也可以針對任何將背景影像設為填色的元素,套用背景填色捲動效果。如果您將背景填色影像設定為在瀏覽器視窗中顯示,您也可以在「瀏覽器填色」選單啟用捲動效果。 

您無法將捲動效果套用至使用特定圖形效果 (例如斜角和內光暈) 的背景填色元素。這些類型的效果套用至所選物件時,「填色」面板「捲動」區段中的選項會停用。

註解:

若要將捲動效果套用至元素,請確認該元素的狀態設定為「正常」。

除了影像和背景填色外,捲動效果也常用於動畫中創造深度錯覺。您可以為頁面上的不同元素設定不同的速度移動。例如,頁面版面可能包含前景元素,且該元素移動速度為中間層元素的兩倍快。動畫內容後方的背景並排填色可設定為中間元素速度的一半。這些設定是模擬眼球實際感受移動的方式。最接近視知覺參考架構的物件看起來移動地較快。

在頁面新增錨點標記時,捲動效果也非常實用。訪客在長頁面或寬頁面按一下連結跳到錨點標籤時,也會顯示捲動效果。您可以使用捲動效果和錨點標籤,將頁面的區段設計為以飛入、淡入或動畫的方式置入定位。您也可以建立一連串選單項目,在訪客向下跳到頁面下方的區域時,結合形成合併的導覽列。

請先瞭解下列關鍵概念後,再開始於版面中使用捲動效果:

關鍵位置

捲動效果中的關鍵位置是指您設定頁面元素要開始移動之處。例如,按一下「瀏覽器填色」選單並選取「捲動」索引標籤。中央區段 (目前顯示 0 px) 的欄位會與關鍵位置相對應。當您開啟動作設定時,T 型控制點的位置會顯示在頁面上。此 T 型控制點可控制動作範圍。0 px 的預設設定表示,T 型控制點設為瀏覽器視窗上緣。

關鍵位置」欄位中指定的像素數表示,您在「初始動作」區段設定的變更會在頁面捲動到該位置時 (以該方向和該速度) 移動。頁面頂端從 0 開始,越向下捲動頁面,像素數越高。在「變形」面板 (「視窗 > 變形」) 中,與頁面頂端之間的距離稱為 Y 值。

關鍵位置

初始動作

捲動效果中的初始動作是捲動動作開始的 px 位置。設定初始動作以定義元素在關鍵位置值與頁面元素邊緣之間的捲動行為。

在「初始動作」區段中,請注意欄位中的值旁有小寫的「x」。此「x」代表倍數。如果訪客加快捲動速度,捲動效果的動作會配合相同的步調,加快速度。

最終動作

若使用者捲動超過指定值,則最終動作可決定頁面元素的移動。在「最終動作」區段設定的值,會在頁面捲動超過關鍵位置 (T 型控制點的位置) 後套用。

套用動作捲動效果的元素,會朝欄位中值大於 0 的方向移動。如果水平和垂直方向都設為 0,元素會固定到頁面,不會移動。

如果水平區段的值為「0」,瀏覽器填色即不會水平左右移動。

若要檢視 Adobe Muse 中捲動效果關鍵概念的視覺展示,請參閱下列影像:

捲動效果中的關鍵位置、初始和最終動作
捲動效果中的關鍵位置、初始和最終動作

如需瞭解捲動效果如何運作,請前往捲動效果網站

此産品由 Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License 授權  Creative Commons 條款未涵蓋 Twitter™ 與 Facebook 文章。

法律說明   |   線上隱私權政策