內容簡介
Summary:
Before After Slider block 允許您創建引人入勝的圖像比較範例，適合展示轉型、翻新、產品改進或任何隨時間變化的視覺變化。
- 雙圖像上傳：易於使用的界面，可以上傳「之前」和「之後」圖像
- 互動滑塊：平滑拖放分隔線，實現無縫圖像比較
- 響應式設計：在桌面和移動佈局之間自動適應
- 可自訂顏色：選擇滑塊分隔線和手柄的喜好色彩
- 觸控友好：針對滑鼠和觸控交互進行優化
- 具備無障礙：考慮到無障礙最佳實踐而建立
Desktop Experience:
- 垂直分隔線，向左右滑動
- 在「之前」圖像上顯示更多或更少的「之後」圖像
- 平滑的滑鼠拖動交互
Mobile Experience:
- 對於小於 767px 的螢幕會自動切換到水平分隔線
- 上下滑動動作，適合觸控互動
- 在移動設備上保持流暢性能
適用於：
- 房地產翻新前後
- 攝影作品集比較
- 產品轉型展示
- 網站重新設計比較
- 醫療或美容程序結果
- 風景或建築變化
支援：
如需支援或功能請求，請訪問我們的支援論壇或通過外掛目錄與我們聯繫。
HTML bulleted list:
<ul>
<li> 雙圖像上傳：易於使用的界面，可以上傳「之前」和「之後」圖像</li>
<li> 互動滑塊：平滑拖放分隔線，實現無縫圖像比較</li>
<li> 響應式設計：在桌面和移動佈局之間自動適應</li>
<li> 可自訂顏色：選擇滑塊分隔線和手柄的喜好色彩</li>
<li> 觸控友好：針對滑鼠和觸控交互進行優化</li>
<li> 具備無障礙：考慮到無障礙最佳實踐而建立</li>
</ul>
外掛標籤
開發者團隊
② 後台搜尋「Responsive Before After Slider Block by Unique Solution」→ 直接安裝（推薦）
原文外掛簡介
The Before After Slider block allows you to create stunning image comparisons that engage your visitors. Perfect for showcasing transformations, renovations, product improvements, or any visual changes over time.
Key Features:
Dual Image Upload: Easy-to-use interface for uploading both “Before” and “After” images
Interactive Slider: Smooth drag-and-drop divider bar for seamless image comparison
Responsive Design: Automatically adapts between desktop and mobile layouts
Customizable Colors: Choose your preferred color for the slider divider and handle
Touch-Friendly: Optimized for both mouse and touch interactions
Accessibility Ready: Built with accessibility best practices in mind
Desktop Experience:
– Vertical divider bar that slides left and right
– Reveals more or less of the “After” image over the “Before” image
– Smooth mouse drag interactions
Mobile Experience:
– Automatically switches to horizontal divider bar on screens under 767px
– Up and down sliding motion for touch-friendly interaction
– Maintains smooth performance on mobile devices
Perfect for:
* Real estate before/after renovations
* Photography portfolio comparisons
* Product transformation showcases
* Website redesign comparisons
* Medical or cosmetic procedure results
* Landscape or architectural changes
Support
For support and feature requests, please visit our support forum or contact us through the plugin directory.
