
內容簡介
進階 Before and After Slider 外掛提供一種虛擬的方式,以同一畫面顯示兩張圖片。使用者可以手動移動滑桿,同時比較兩張圖片。此外掛可幫助在同一畫面中顯示 Before 和 After 的圖片,並附有可移動的把手,主要用於用一個橫桿在中間比較兩張圖片。
簡碼參數
orientation:Before 和 After 圖像的方向('horizontal' 或 'vertical')
before_label:設置自訂的 Before 標籤
after_label:設置自訂的 After 標籤
no_overlay:不顯示 Before 和 After 的重疊圖層
move_slider_on_hover:在滑鼠懸停時移動滑桿?
click_to_move:允許使用者點擊(或輕觸)圖像上的任何位置以移動滑桿至該位置。
主要特點
✔️ 更改 Before/After 標籤。
✔️ 水平和垂直方向選項。
✔️ 圖像重疊選項。
✔️ 滑鼠懸停時移動滑桿。
✔️ 允許使用者點擊圖像上的任何位置以移動滑桿至該位置。
使用方法
進階 Before and After Slider 外掛非常簡單易用,只需要在任何位置放置簡碼。
簡碼:
[abas-slider before_src="" after_src="" before_label="Before Label" after_label="After Label" click_to_move="true"]
點擊此處觀看 演示
外掛標籤
開發者團隊
② 後台搜尋「Advanced Before After Slider」→ 直接安裝(推薦)
原文外掛簡介
The Advanced Before and After Slider plugin offers a virtual way to show two images in the same frame. Users can manually move the slider to compare both images at once. This plugin help to show before and after image in one frame with movable handle, Main use for comparing two images in one frame with a bar in the middle.
Shortcode Parameters
orientation: Orientation of the before and after images (‘horizontal’ or ‘vertical’)
before_label: Set a custom before label
after_label: Set a custom after label
no_overlay: Do not show the overlay with before and after
move_slider_on_hover: Move slider on mouse hover?
click_to_move: Allow a user to click (or tap) anywhere on the image to move the slider to that location.
Key Features
✔️ Change Before/After Label.
✔️ Horizontal and Vertical Orientation option.
✔️ Image Overlay Option.
✔️ Move the slider on mouse hover.
✔️ Allow a user to click anywhere on the image to move the slider to that location.
How to Use
Advanced Before and After Slider plugin is a very simple way to use, you just put a shortcode anywhere.
Shortcode:
[abas-slider before_src="" after_src="" before_label="Before Label" after_label="After Label" click_to_move="true"]
Click here to see demo
