> For the complete documentation index, see [llms.txt](https://helps.ptengine.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://helps.ptengine.com/cn/experience/campaign/create-new-1/stickybar-carousel.md). # 悬浮条轮播模式 ## 什么是轮播模式轮播模式可以把一条悬浮条（固定栏）变成多张**幻灯片**，在同一条悬浮条中自动或手动切换展示。当你有多个卖点、多张优惠券或多条公告想要在一条有限的横幅里依次呈现时，轮播模式非常合适。常见使用场景： * 多个促销卖点循环展示，让用户在不占用更多页面空间的前提下看到更多信息； * 多张优惠券 / 活动轮流曝光； * 公告、通知滚动播报。 > **提示**：关闭轮播模式时，系统会保留当前正在编辑的这张幻灯片作为普通的静态悬浮条，其余幻灯片会被删除。

## 开启轮播模式在悬浮条编辑器中，通过操作工具条上的 **「轮播模式」** 开关即可开启或关闭轮播。

## 轮播布局：全宽 / 内容居中轮播布局决定了整条轮播条的整体呈现思路，建议**先确定布局**，再去编辑各张幻灯片。在「轮播设置」顶部即可选择：

### 全宽（默认）每张幻灯片的背景**铺满整条悬浮条**，切换时**整条一起滑动**——背景和内容作为一个整体左右（或上下）切换。 * **适用场景**：每屏是一套完整的整屏视觉、且各屏风格/背景不同。例如多张不同主视觉的促销 Banner（红色大促屏 → 黑色新品屏 → 绿色会员屏）轮流展示，想让**整条横幅整体焕新**。 * **视觉特点**：切换时你能看到**整条背景跟着一起动**。

### 内容居中整条悬浮条使用**一层统一背景**（铺满全宽、切换时**不动**），只有**内容和左右箭头**在中心的一个固定宽度内滑动切换。 * **适用场景**：想保持整条**统一底色/品牌色**（如全宽黑条），只轮播其中的**文案 / 信息**，视觉更克制统一；适合公告轮播、多条卖点文字轮播，或宽屏下不希望内容被拉得太散。参考电商站常见的顶部通知条（全宽深色条 + 中间文字带左右箭头切换）。 * **视觉特点**：**背景固定不动**（全宽统一底色），只有**中间内容在切换**，两侧留白仍是统一底色。 * **配套设置**（选内容居中后出现）： * **整条背景（铺满全宽）**：设置那层统一底色（色值）； * **内容宽度**：内容与左右箭头的居中最大宽度，默认 **980（PC）/ 375（移动）**，可填数字调整。超出该宽度的内容在预览/上线时会被裁剪（编辑器里以居中虚线框标出安全范围）。

> **提示**：两种布局下每张幻灯片仍可有自己的背景；内容居中模式下，每屏背景叠加在统一底色之上、只作用于中心内容区（透明时透出统一底色）。布局的实际效果请在 **「预览」** 中查看。 ## 轮播设置详解在配置面板的「轮播设置」中，可以调整轮播的动画与交互表现。 > **注意**：动画与轮播效果需要在 **「预览」** 中查看实际表现，编辑器画布中不会实时播放。 * **过渡效果**：切换幻灯片时的动画方式，可选 *滑动 / 垂直滑动 / 淡入淡出 / 缩放淡入*； * **指示器**：底部分页指示器样式，可选 *无 / 圆点 / 分数 / 进度条*；选择圆点时还可设置圆点大小、指示器颜色和选中点颜色； * **左右箭头**：显示左右切换箭头，可设置箭头大小与颜色； * **自动播放** 与 **动画速度**：开启后幻灯片自动切换，动画速度控制单次切换动画的时长（单位毫秒）； * **循环播放**：播放到最后一张后回到第一张，循环轮播； * **展示时长**：默认所有幻灯片使用统一的全局延迟；如需让某一张停留更久或更短，可在该幻灯片设置中开启 **「自定义时长」** 单独设置。

## 管理幻灯片开启轮播后，配置面板中会出现 **「幻灯片」** 列表，你可以在此切换、添加、删除幻灯片，以及**拖拽调整播放顺序**。 ### 添加幻灯片点击「添加幻灯片」，有三种创建方式： * **复制当前幻灯片**：保留当前幻灯片的背景、内容和点击动作，适合制作风格一致的多张幻灯片； * **从空白开始**：仅保留默认布局，从空内容开始设计； * **从模板选择**：选用倒计时 / 优惠券 / 促销等预设布局快速创建。

### 独立编辑每张幻灯片每张幻灯片都可以**单独编辑**。切换幻灯片标签，即可在画布上分别编辑各屏的内容元素（文字、图片、按钮等）。在幻灯片列表中展开某一张，还可以配置这张幻灯片**独有的设置项**： * **背景**：可选颜色（支持渐变）或图片；选择图片时还可上传/更换图片并调整不透明度。此背景仅作用于当前这张幻灯片，各屏互不影响； * **点击动作**：为整张幻灯片设置点击动作，如跳转链接或事件计测； * **展示时长**：勾选 **「自定义时长」** 后，可单独设置这张幻灯片的停留时间（单位毫秒）；不勾选则沿用轮播的全局延迟。

### 调整播放顺序在幻灯片列表中，通过拖拽即可调整各张幻灯片的先后顺序，轮播将按照列表中的顺序依次播放。

### 关于高度轮播条中所有幻灯片**等高**，整体高度会跟随内容最高的那一张自动统一，从而保证切换时不会出现高度跳动。你也可以在 **「位置&大小」→「浮条布局」→「高度」** 中手动调整整条轮播条的高度。

## 注意事项 * 轮播的动画效果请通过 **「预览」** 确认，编辑器画布中不实时播放； * 一条轮播悬浮条最多支持 **10 张**幻灯片。