{"id":22990651,"date":"2024-10-11T02:29:58","date_gmt":"2024-10-11T02:29:58","guid":{"rendered":"https:\/\/www.fastudio.my\/?page_id=22990651"},"modified":"2024-11-15T16:43:22","modified_gmt":"2024-11-15T16:43:22","slug":"before-after-slider","status":"publish","type":"page","link":"https:\/\/demo.fastudio.my\/divi-pixel\/modules\/before-after-slider\/","title":{"rendered":"Before & After Slider"},"content":{"rendered":"\n[et_pb_section fb_built=”1″ _builder_version=”4.27.2″ _module_preset=”default” background_color=”#0C71C3″ hover_enabled=”0″ global_colors_info=”{}” background_enable_pattern_style=”on” background_pattern_style=”diagonal-stripes” background_pattern_color=”rgba(0,0,0,0.04)” sticky_enabled=”0″][et_pb_row _builder_version=”4.27.2″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.27.2″ _module_preset=”default” global_colors_info=”{}”][et_pb_heading title=”Before & After Slider” _builder_version=”4.27.2″ _module_preset=”default” title_font=”|700|||||||” title_text_align=”center” title_text_color=”#f2bc39″ hover_enabled=”0″ global_colors_info=”{}” sticky_enabled=”0″][\/et_pb_heading][et_pb_text _builder_version=”4.27.2″ _module_preset=”default” text_text_color=”#FFFFFF” text_font_size=”16px” text_orientation=”center” global_colors_info=”{}”]

Pamerkan foto sebelum & selepas anda dengan cara yang menakjubkan dan interaktif dengan modul Divi Pixel yang mudah digunakan ini. Gunakan Slider Sebelum & Selepas untuk memaparkan dua versi imej hanya dengan meluncur ke atasnya.<\/p>[\/et_pb_text][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=”1″ custom_padding_last_edited=”on|tablet” _builder_version=”4.19.4″ background_color=”rgba(68,0,153,0.06)” custom_padding=”120px||120px|||” custom_padding_tablet=”80px||80px||false|false” custom_padding_phone=”60px||60px||false|false” global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_row column_structure=”1_2,1_2″ custom_padding_last_edited=”on|tablet” _builder_version=”4.19.4″ _module_preset=”default” max_width=”1300px” custom_padding_tablet=”||0px||false|false” custom_padding_phone=”||0px||false|false” global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_column type=”1_2″ _builder_version=”4.19.4″ _module_preset=”default” background_color=”#FFFFFF” custom_padding=”20px|20px|20px|20px|false|false” box_shadow_style=”preset3″ box_shadow_blur=”50px” box_shadow_color=”rgba(68,0,153,0.13)” global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_blurb title=”Vertical Direction” use_icon=”on” font_icon=”||fa||900″ icon_color=”rgba(10,0,0,0.21)” image_icon_background_color=”rgba(68,0,153,0.04)” image_icon_width=”23px” icon_alignment=”left” content_max_width=”1100px” _builder_version=”4.19.4″ _module_preset=”default” header_font=”Poppins|700|||||||” header_font_size=”19px” body_font=”|300|||||||” body_font_size=”17px” body_line_height=”1.5em” image_icon_custom_padding=”15px|20px|15px|20px|false|false” max_width=”458px” custom_padding=”||||false|false” body_font_size_tablet=”17px” body_font_size_phone=”15px” body_font_size_last_edited=”on|phone” custom_css_blurb_image=”margin-bottom: 20px;” border_radii_image=”on|100px|100px|100px|100px” global_colors_info=”{}” theme_builder_area=”post_content”]

Choose vertical slider orientation and drag the slider up and down to see two versions of the image.<\/p>[\/et_pb_blurb][dipi_before_after_slider before_image=”https:\/\/www.fastudio.my\/wp-content\/uploads\/2024\/10\/bas-01.jpg” after_image=”https:\/\/www.fastudio.my\/wp-content\/uploads\/2024\/10\/bas-02.jpg” direction=”vertical” handle_icon=”arrow” before_label_bg_color=”#FFFFFF” after_label_bg_color=”#FFFFFF” overlay_color=”rgba(0,0,0,0.2)” slider_width=”2px” handle_container_bg_blur=”10px” handle_circle_size=”45px” handle_circle_border_width=”2px” handle_icon_arrow_width=”2px” handle_icon_gap=”4″ handle_hover_icon_gap=”8″ handle_circle_size_tablet=”45px” handle_circle_size_phone=”35px” handle_circle_size_last_edited=”on|phone” handle_hover_icon_gap_tablet=”8″ handle_hover_icon_gap_phone=”6″ handle_hover_icon_gap_last_edited=”on|phone” _builder_version=”4.19.4″ _module_preset=”default” labels_font_size_tablet=”” labels_font_size_phone=”11px” labels_font_size_last_edited=”on|phone” labels_line_height_tablet=”” labels_line_height_phone=”2em” labels_line_height_last_edited=”on|phone” global_colors_info=”{}” theme_builder_area=”post_content”][\/dipi_before_after_slider][\/et_pb_column][et_pb_column type=”1_2″ _builder_version=”4.19.4″ _module_preset=”default” background_color=”#FFFFFF” custom_padding=”20px|20px|20px|20px|false|false” box_shadow_style=”preset3″ box_shadow_blur=”50px” box_shadow_color=”rgba(68,0,153,0.13)” global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_blurb title=”Horizontal Direction” use_icon=”on” font_icon=”||fa||900″ icon_color=”rgba(10,0,0,0.21)” image_icon_background_color=”rgba(68,0,153,0.04)” image_icon_width=”23px” icon_alignment=”left” content_max_width=”1100px” _builder_version=”4.19.4″ _module_preset=”default” header_font=”Poppins|700|||||||” header_font_size=”19px” body_font=”|300|||||||” body_font_size=”17px” body_line_height=”1.5em” image_icon_custom_padding=”15px|15px|15px|15px|false|false” max_width=”458px” custom_padding=”||||false|false” body_font_size_tablet=”17px” body_font_size_phone=”15px” body_font_size_last_edited=”on|phone” custom_css_blurb_image=”margin-bottom: 20px;” border_radii_image=”on|100px|100px|100px|100px” global_colors_info=”{}” theme_builder_area=”post_content”]

Choose horizontal slider direction and drag the slider sideways to see two versions of the image.<\/p>[\/et_pb_blurb][dipi_before_after_slider before_image=”https:\/\/www.fastudio.my\/wp-content\/uploads\/2024\/10\/bas-03.jpg” after_image=”https:\/\/www.fastudio.my\/wp-content\/uploads\/2024\/10\/bas-04.jpg” handle_icon=”arrow” before_label_bg_color=”#FFFFFF” after_label_bg_color=”#FFFFFF” overlay_color=”rgba(10,10,10,0.2)” slider_color=”#FFFFFF” slider_width=”2px” slider_handle_icon_color=”#FFFFFF” handle_container_bg_blur=”10px” slider_handle_color=”#FFFFFF” handle_circle_size=”45px” handle_circle_border_width=”2px” handle_icon_arrow_width=”2px” handle_icon_gap=”4″ handle_hover_icon_gap=”8″ handle_circle_size_tablet=”45px” handle_circle_size_phone=”35px” handle_circle_size_last_edited=”on|phone” _builder_version=”4.19.4″ _module_preset=”default” labels_font_size_tablet=”” labels_font_size_phone=”11px” labels_font_size_last_edited=”on|phone” labels_line_height_tablet=”” labels_line_height_phone=”2.5em” labels_line_height_last_edited=”on|phone” custom_css_dss_image_before=”filter: brightness(90%)” custom_css_dss_image_after=”filter: brightness(90%)” global_colors_info=”{}” custom_css_dss_label_before_last_edited=”on|phone” custom_css_dss_label_before_phone=”top: 80%;” custom_css_dss_label_after_last_edited=”on|phone” custom_css_dss_label_after_phone=”top: 80%;” theme_builder_area=”post_content”][\/dipi_before_after_slider][\/et_pb_column][\/et_pb_row][et_pb_row column_structure=”1_2,1_2″ _builder_version=”4.19.4″ _module_preset=”default” max_width=”1300px” global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_column type=”1_2″ _builder_version=”4.19.4″ _module_preset=”default” background_color=”#FFFFFF” custom_padding=”20px|20px|20px|20px|false|false” box_shadow_style=”preset3″ box_shadow_blur=”50px” box_shadow_color=”rgba(68,0,153,0.13)” global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_blurb title=”Custom Labels” use_icon=”on” font_icon=”||fa||900″ icon_color=”rgba(10,0,0,0.21)” image_icon_background_color=”rgba(68,0,153,0.04)” image_icon_width=”23px” icon_alignment=”left” content_max_width=”1100px” _builder_version=”4.19.4″ _module_preset=”default” header_font=”Poppins|700|||||||” header_font_size=”19px” body_font=”|300|||||||” body_font_size=”17px” body_line_height=”1.5em” image_icon_custom_padding=”15px|12px|15px|12px|false|false” max_width=”519px” custom_padding=”||||false|false” body_font_size_tablet=”17px” body_font_size_phone=”14px” body_font_size_last_edited=”on|phone” custom_css_blurb_image=”margin-bottom: 20px;” border_radii_image=”on|100px|100px|100px|100px” global_colors_info=”{}” theme_builder_area=”post_content”]

Add your own labels text like shown below. Labels can be always displayed on the overlay or just on mouseover.<\/p>[\/et_pb_blurb][dipi_before_after_slider before_image=”https:\/\/www.fastudio.my\/wp-content\/uploads\/2024\/10\/bas-image.jpg” after_image=”https:\/\/www.fastudio.my\/wp-content\/uploads\/2024\/10\/bas-image.jpg” handle_icon=”arrow” before_label=”Black & White” after_label=”Color Photo” before_label_bg_color=”#0a0a0a” after_label_bg_color=”#0a0a0a” overlay_color=”rgba(0,0,0,0.2)” overlay_visibility=”hide_on_hover” slider_color=”#0a0000″ slider_width=”2px” slider_handle_icon_color=”#FFFFFF” handle_container_bg_blur=”10px” slider_handle_color=”#0a0000″ slider_handle_bg_color=”#0a0a0a” handle_circle_size=”45px” handle_circle_border_width=”2px” handle_icon_arrow_width=”2px” handle_icon_gap=”5″ handle_hover_icon_gap=”8″ handle_circle_size_tablet=”45px” handle_circle_size_phone=”35px” handle_circle_size_last_edited=”on|phone” handle_icon_size_tablet=”” handle_icon_size_phone=”4px” handle_icon_size_last_edited=”on|phone” _builder_version=”4.19.4″ _module_preset=”default” labels_text_color=”#FFFFFF” labels_font_size_tablet=”” labels_font_size_phone=”11px” labels_font_size_last_edited=”on|phone” labels_line_height_tablet=”” labels_line_height_phone=”2em” labels_line_height_last_edited=”on|phone” custom_css_dss_image_before=”filter: grayscale(100%);” global_colors_info=”{}” custom_css_dss_label_before_last_edited=”on|phone” custom_css_dss_label_before_phone=”top: 80%;||padding: 5px !important;” custom_css_dss_label_after_last_edited=”on|phone” custom_css_dss_label_after_phone=”top: 80%;||padding: 5px !important;” theme_builder_area=”post_content”][\/dipi_before_after_slider][\/et_pb_column][et_pb_column type=”1_2″ _builder_version=”4.19.4″ _module_preset=”default” background_color=”#FFFFFF” custom_padding=”20px|20px|20px|20px|false|false” box_shadow_style=”preset3″ box_shadow_blur=”50px” box_shadow_color=”rgba(68,0,153,0.13)” global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_blurb title=”Slider Customization” use_icon=”on” font_icon=”||fa||900″ icon_color=”rgba(10,0,0,0.21)” image_icon_background_color=”rgba(68,0,153,0.04)” image_icon_width=”23px” icon_alignment=”left” content_max_width=”1100px” _builder_version=”4.19.4″ _module_preset=”default” header_font=”Poppins|700|||||||” header_font_size=”19px” body_font=”|300|||||||” body_font_size=”17px” body_line_height=”1.5em” image_icon_custom_padding=”15px|15px|15px|15px|false|false” max_width=”458px” custom_padding=”||||false|false” body_font_size_tablet=”17px” body_font_size_phone=”15px” body_font_size_last_edited=”on|phone” custom_css_blurb_image=”margin-bottom: 20px;” border_radii_image=”on|100px|100px|100px|100px” global_colors_info=”{}” theme_builder_area=”post_content”]

Set slider style, and initial position and customize slider line and handle colors to fit your requirements.<\/p>[\/et_pb_blurb][dipi_before_after_slider before_image=”https:\/\/www.fastudio.my\/wp-content\/uploads\/2024\/10\/bas-05.jpg” after_image=”https:\/\/www.fastudio.my\/wp-content\/uploads\/2024\/10\/bas-05.jpg” before_label=”Filtered” after_label=”No Filter” before_label_bg_color=”#0a0a0a” after_label_bg_color=”#0a0a0a” overlay_color=”rgba(10,10,10,0.2)” overlay_visibility=”hide_on_hover” offset=”27″ slider_color=”#0a0a0a” slider_width=”2px” slider_handle_icon_color=”#0a0a0a” handle_container_bg_blur=”0px” handle_use_circle=”off” handle_icon_size=”12px” handle_icon_gap=”0″ handle_hover_icon_gap=”8″ _builder_version=”4.19.4″ _module_preset=”default” labels_text_color=”#FFFFFF” labels_font_size_tablet=”” labels_font_size_phone=”11px” labels_font_size_last_edited=”on|phone” labels_line_height_tablet=”” labels_line_height_phone=”2.2em” labels_line_height_last_edited=”on|phone” custom_css_dss_image_before=”filter: hue-rotate(40deg);” global_colors_info=”{}” custom_css_dss_label_before_last_edited=”on|phone” custom_css_dss_label_before_phone=”top: 80%;||padding: 5px;” custom_css_dss_label_after_last_edited=”on|phone” custom_css_dss_label_after_phone=”top: 80%;||padding: 5px;” theme_builder_area=”post_content”][\/dipi_before_after_slider][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=”1″ custom_padding_last_edited=”on|tablet” _builder_version=”4.16″ background_color=”#ffffff” custom_padding=”100px||140px|||” custom_padding_tablet=”80px||80px||false|false” custom_padding_phone=”60px||60px||false|false” global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_row _builder_version=”4.19.4″ background_color=”RGBA(255,255,255,0)” width_tablet=”90%” width_phone=”” width_last_edited=”on|phone” max_width=”1200px” module_alignment=”center” custom_padding=”0px||0px||false|false” global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_column type=”4_4″ _builder_version=”4.16″ global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_cta title=”Highly Customizable” _builder_version=”4.19.4″ header_font=”|||on|||||” header_text_color=”#ff4200″ header_font_size=”17px” header_letter_spacing=”2px” body_font=”|600|||||||” body_text_color=”#15022a” body_font_size=”34px” body_line_height=”1.2em” background_enable_color=”off” background_layout=”light” custom_margin=”||40px||false|false” custom_padding=”||0px||false|false” body_font_size_tablet=”34px” body_font_size_phone=”28px” body_font_size_last_edited=”on|tablet” global_colors_info=”{}” theme_builder_area=”post_content”]

Activate Slider on Hover or Click<\/p>[\/et_pb_cta][\/et_pb_column][\/et_pb_row][et_pb_row _builder_version=”4.19.4″ _module_preset=”default” custom_padding=”0px||0px|||” global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_column type=”4_4″ _builder_version=”4.19.4″ _module_preset=”default” border_radii=”on|10px|10px|10px|10px” global_colors_info=”{}” theme_builder_area=”post_content”][dipi_before_after_slider before_image=”https:\/\/www.fastudio.my\/wp-content\/uploads\/2024\/10\/teeth-02.jpg” after_image=”https:\/\/www.fastudio.my\/wp-content\/uploads\/2024\/10\/teeth-01.jpg” move_slider=”on_hover” handle_icon=”arrow” before_label_bg_color=”#FFFFFF” after_label_bg_color=”#FFFFFF” overlay_color=”rgba(0,0,0,0.25)” offset=”34″ slider_color=”#FFFFFF” slider_width=”2px” slider_handle_icon_color=”#FFFFFF” handle_container_bg_blur=”15px” slider_handle_color=”#FFFFFF” slider_handle_bg_color=”RGBA(255,255,255,0)” handle_circle_size=”50px” handle_circle_border_width=”2px” handle_icon_size=”8px” handle_icon_arrow_width=”2px” handle_hover_icon_gap=”10″ handle_circle_size_tablet=”50px” handle_circle_size_phone=”35px” handle_circle_size_last_edited=”on|phone” handle_icon_size_tablet=”8px” handle_icon_size_phone=”5px” handle_icon_size_last_edited=”on|phone” _builder_version=”4.19.4″ labels_font=”|||on|||||” labels_text_color=”#15022A” labels_font_size=”12px” labels_font_size_tablet=”12px” labels_font_size_phone=”10px” labels_font_size_last_edited=”on|phone” custom_css_dss_label_before=”border-radius: 0 50px 50px 0;||margin-left: -10px !important;” custom_css_dss_label_after=”border-radius: 50px 0 0 50px;||margin-right: -10px !important;” global_colors_info=”{}” theme_builder_area=”post_content”][\/dipi_before_after_slider][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=”1″ _builder_version=”4.19.4″ _module_preset=”default” background_color=”rgba(68,0,153,0.06)” custom_padding=”100px||100px|||” global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_row column_structure=”1_2,1_2″ _builder_version=”4.19.4″ background_color=”RGBA(255,255,255,0)” width_tablet=”90%” width_phone=”” width_last_edited=”on|phone” max_width=”1300px” module_alignment=”center” custom_padding=”||||false|false” global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_column type=”1_2″ _builder_version=”4.16″ global_colors_info=”{}” theme_builder_area=”post_content”][dipi_before_after_slider before_image=”https:\/\/www.fastudio.my\/wp-content\/uploads\/2024\/10\/dp-demo-26.jpg” after_image=”https:\/\/www.fastudio.my\/wp-content\/uploads\/2024\/10\/dp-demo-25.jpg” direction=”vertical” before_label_bg_color=”#ffffff” after_label_bg_color=”#ffffff” overlay_color=”rgba(21,2,42,0.27)” slider_color=”#ff4200″ slider_handle_color=”#ff4200″ slider_handle_bg_color=”#ff4200″ handle_hover_icon_gap=”8″ _builder_version=”4.19.4″ labels_font=”|||on|||||” labels_text_color=”#15022a” labels_font_size_tablet=”” labels_font_size_phone=”11px” labels_font_size_last_edited=”on|phone” labels_line_height_tablet=”” labels_line_height_phone=”2.2em” labels_line_height_last_edited=”on|phone” box_shadow_style=”preset3″ global_colors_info=”{}” theme_builder_area=”post_content”][\/dipi_before_after_slider][\/et_pb_column][et_pb_column type=”1_2″ _builder_version=”4.16″ global_colors_info=”{}” theme_builder_area=”post_content”][dipi_before_after_slider before_image=”https:\/\/www.fastudio.my\/wp-content\/uploads\/2024\/10\/dp-demo-27.jpg” after_image=”https:\/\/www.fastudio.my\/wp-content\/uploads\/2024\/10\/dp-demo-28.jpg” always_show_labels=”on” before_label_bg_color=”#15022a” after_label_bg_color=”#15022a” enable_overlay=”off” overlay_color=”rgba(21,2,42,0.27)” offset=”29″ slider_color=”#15022a” slider_handle_color=”#15022a” slider_handle_bg_color=”#15022a” handle_icon_size=”5px” handle_hover_icon_gap=”8″ _builder_version=”4.19.4″ labels_font=”Abel||||||||” labels_text_color=”#ffffff” box_shadow_style=”preset3″ global_colors_info=”{}” handle_circle_size__hover_enabled=”off|hover” theme_builder_area=”post_content”][\/dipi_before_after_slider][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=”1″ custom_padding_last_edited=”on|tablet” _builder_version=”4.19.4″ background_color=”#0a0000″ background_enable_pattern_style=”on” background_pattern_style=”zig-zag-2″ background_pattern_color=”rgba(255,255,255,0.06)” custom_padding=”140px||150px|||” custom_padding_tablet=”80px||80px||false|false” custom_padding_phone=”60px||60px||false|false” global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_row column_structure=”2_5,3_5″ _builder_version=”4.19.4″ _module_preset=”default” max_width=”1200px” custom_margin=”||20px||false|false” custom_padding=”0px|||||” global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_column type=”2_5″ _builder_version=”4.19.4″ _module_preset=”default” global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_text _builder_version=”4.19.4″ _module_preset=”default” header_2_font=”|700|||||||” header_2_text_color=”#FFFFFF” header_2_font_size=”57px” header_2_line_height=”0.8em” header_2_font_size_tablet=”57px” header_2_font_size_phone=”40px” header_2_font_size_last_edited=”on|phone” global_colors_info=”{}” theme_builder_area=”post_content”]

Before & After<\/h2>[\/et_pb_text][\/et_pb_column][et_pb_column type=”3_5″ _builder_version=”4.19.4″ _module_preset=”default” global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_text _builder_version=”4.19.4″ _module_preset=”default” text_text_color=”rgba(255,255,255,0.8)” text_line_height=”1.6em” global_colors_info=”{}” theme_builder_area=”post_content”]

With the Divi Pixel Before & After Slider, you can easily create a vertical or horizontal slider to compare 2 images in a few simple clicks.<\/p>[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row _builder_version=”4.19.4″ _module_preset=”default” max_width=”1200px” custom_padding=”1px||0px|||” global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_column type=”4_4″ _builder_version=”4.19.4″ _module_preset=”default” global_colors_info=”{}” theme_builder_area=”post_content”][dipi_before_after_slider before_image=”https:\/\/www.fastudio.my\/wp-content\/uploads\/2024\/10\/bas-06.jpg” after_image=”https:\/\/www.fastudio.my\/wp-content\/uploads\/2024\/10\/bas-06.jpg” move_slider=”on_hover” handle_icon=”arrow” before_label=”Before Correction” after_label=”After Correction” always_show_labels=”on” before_label_bg_color=”#ffffff” after_label_bg_color=”#ffffff” enable_overlay=”off” slider_color=”RGBA(255,255,255,0)” slider_width=”0px” handle_container_bg_blur=”10px” handle_circle_size=”50px” handle_circle_border_width=”2px” handle_circle_border_style=”dashed” handle_icon_arrow_width=”2px” handle_hover_icon_gap=”8″ handle_circle_size_tablet=”50px” handle_circle_size_phone=”35px” handle_circle_size_last_edited=”on|phone” handle_icon_size_tablet=”” handle_icon_size_phone=”5px” handle_icon_size_last_edited=”on|phone” handle_icon_gap_tablet=”” handle_icon_gap_phone=”4″ handle_icon_gap_last_edited=”on|phone” handle_hover_icon_gap_tablet=”8″ handle_hover_icon_gap_phone=”6″ handle_hover_icon_gap_last_edited=”on|phone” _builder_version=”4.19.4″ _module_preset=”default” labels_font=”|||on|||||” labels_text_color=”#15022A” labels_font_size_tablet=”” labels_font_size_phone=”10px” labels_font_size_last_edited=”on|phone” labels_line_height_tablet=”” labels_line_height_phone=”2.6em” labels_line_height_last_edited=”on|phone” custom_css_dss_image_before=”filter: saturate(30%);” custom_css_dss_label_before=”top: 90%;” custom_css_dss_label_after=”top: 90%;” border_width_all_slider_line=”1px” border_color_all_slider_line=”#FFFFFF” border_style_all_slider_line=”dashed” global_colors_info=”{}” custom_css_dss_label_after_last_edited=”on|desktop” custom_css_dss_label_after_phone=”top: 80%;||letter-spacing: 0;” custom_css_dss_label_before_last_edited=”on|phone” custom_css_dss_label_before_phone=”top: 80%;||letter-spacing: 0;” custom_css_dss_label_after_tablet=”top: 90%;” custom_css_dss_label_before_tablet=”top: 90%;” theme_builder_area=”post_content”][\/dipi_before_after_slider][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=”1″ _builder_version=”4.19.4″ _module_preset=”default” background_color=”#FFFFFF” custom_padding=”120px||80px|||” global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_row column_structure=”1_2,1_2″ make_equal=”on” _builder_version=”4.27.2″ background_color=”RGBA(255,255,255,0)” width_tablet=”90%” width_phone=”” width_last_edited=”on|phone” max_width=”1300px” module_alignment=”center” custom_padding=”||||false|false” global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_column type=”1_2″ _builder_version=”4.16″ global_colors_info=”{}” theme_builder_area=”post_content”][dipi_before_after_slider before_image=”https:\/\/www.fastudio.my\/wp-content\/uploads\/2024\/10\/bas-07.jpg” after_image=”https:\/\/www.fastudio.my\/wp-content\/uploads\/2024\/10\/bas-08.jpg” direction=”vertical” handle_icon=”arrow” before_label_bg_color=”#ffffff” after_label_bg_color=”#ffffff” overlay_color=”rgba(10,0,0,0.27)” overlay_visibility=”hide_on_hover” offset=”70″ slider_color=”#FFFFFF” slider_width=”1px” slider_handle_icon_color=”#FFFFFF” handle_container_bg_blur=”15px” slider_handle_color=”#FFFFFF” slider_handle_bg_color=”RGBA(255,255,255,0)” handle_circle_size=”50px” handle_circle_border_width=”1px” handle_icon_size=”8px” handle_icon_arrow_width=”1px” handle_icon_gap=”5″ handle_hover_icon_gap=”8″ _builder_version=”4.19.4″ labels_font=”|||on|||||” labels_text_color=”#15022a” box_shadow_style=”preset3″ global_colors_info=”{}” theme_builder_area=”post_content”][\/dipi_before_after_slider][\/et_pb_column][et_pb_column type=”1_2″ module_class=”dp-vertical-align” _builder_version=”4.27.2″ global_colors_info=”{}” theme_builder_area=”post_content”][et_pb_cta title=”Powerful Features” _builder_version=”4.27.2″ header_font=”|||on|||||” header_text_color=”#ff4200″ header_font_size=”17px” header_letter_spacing=”2px” body_font=”|600|||||||” body_text_color=”#15022a” body_font_size=”34px” body_line_height=”1.2em” background_enable_color=”off” text_orientation=”left” background_layout=”light” custom_margin=”||-1px||false|false” custom_padding=”||0px|0px|false|false” body_font_size_tablet=”34px” body_font_size_phone=”28px” body_font_size_last_edited=”on|tablet” global_colors_info=”{}” theme_builder_area=”post_content”]

Showcase your work results in a stunning way<\/p>[\/et_pb_cta][et_pb_text _builder_version=”4.27.2″ text_font=”|300|||||||” text_text_color=”rgba(21,2,42,0.5)” text_font_size=”18px” text_line_height=”1.8em” module_alignment=”left” custom_margin=”||30px||false|false” custom_margin_tablet=”||||false|false” custom_margin_phone=”||||false|false” custom_margin_last_edited=”on|desktop” custom_padding=”||||false|false” global_colors_info=”{}” max_width__hover_enabled=”off|desktop” theme_builder_area=”post_content”]

Are you a make-up artist, or maybe a builder or hairdresser? Use the Before & After Slider to display your work in a beautiful and neat way. Add 2 versions of images, and showcase your work results with style.<\/p>[\/et_pb_text][et_pb_blurb title=”Add custom labels” use_icon=”on” font_icon=”N||divi||400″ icon_color=”#c1bcc9″ image_icon_background_color=”#f2eff4″ icon_placement=”left” image_icon_width=”13px” content_max_width=”1100px” _builder_version=”4.27.2″ _module_preset=”default” header_font_size=”15px” header_line_height=”1.9em” image_icon_custom_padding=”8px|8px|8px|8px|false|false” custom_margin=”||1px|||” border_radii_image=”on|100%|100%|100%|100%” icon_font_size=”13px” use_circle=”on” circle_color=”#1aa325″ global_colors_info=”{}” image_icon_background_color__sticky_enabled=”#2ea3f2″ image_icon_background_color__sticky=”#2ea3f2″ theme_builder_area=”post_content”][\/et_pb_blurb][et_pb_blurb title=”Use horizontal or vertical slider direction” use_icon=”on” font_icon=”N||divi||400″ icon_color=”#c1bcc9″ image_icon_background_color=”#f2eff4″ icon_placement=”left” image_icon_width=”13px” content_max_width=”1100px” _builder_version=”4.19.4″ _module_preset=”default” header_font_size=”15px” header_line_height=”1.9em” image_icon_custom_padding=”8px|8px|8px|8px|false|false” custom_margin=”||1px|||” border_radii_image=”on|100%|100%|100%|100%” icon_font_size=”13px” use_circle=”on” circle_color=”#1aa325″ global_colors_info=”{}” image_icon_background_color__sticky_enabled=”#2ea3f2″ image_icon_background_color__sticky=”#2ea3f2″ theme_builder_area=”post_content”][\/et_pb_blurb][et_pb_blurb title=”Activate slider on hover or click” use_icon=”on” font_icon=”N||divi||400″ icon_color=”#c1bcc9″ image_icon_background_color=”#f2eff4″ icon_placement=”left” image_icon_width=”13px” content_max_width=”1100px” _builder_version=”4.19.4″ _module_preset=”default” header_font_size=”15px” header_line_height=”1.9em” image_icon_custom_padding=”8px|8px|8px|8px|false|false” custom_margin=”||1px|||” border_radii_image=”on|100%|100%|100%|100%” icon_font_size=”13px” use_circle=”on” circle_color=”#1aa325″ global_colors_info=”{}” image_icon_background_color__sticky_enabled=”#2ea3f2″ image_icon_background_color__sticky=”#2ea3f2″ theme_builder_area=”post_content”][\/et_pb_blurb][et_pb_blurb title=”Add images alt text for SEO” use_icon=”on” font_icon=”N||divi||400″ icon_color=”#c1bcc9″ image_icon_background_color=”#f2eff4″ icon_placement=”left” image_icon_width=”13px” content_max_width=”1100px” _builder_version=”4.19.4″ _module_preset=”default” header_font_size=”15px” header_line_height=”1.9em” image_icon_custom_padding=”8px|8px|8px|8px|false|false” custom_margin=”||1px|||” border_radii_image=”on|100%|100%|100%|100%” icon_font_size=”13px” use_circle=”on” circle_color=”#1aa325″ global_colors_info=”{}” image_icon_background_color__sticky_enabled=”#2ea3f2″ image_icon_background_color__sticky=”#2ea3f2″ theme_builder_area=”post_content”][\/et_pb_blurb][et_pb_blurb title=”Customize slider line and handle” use_icon=”on” font_icon=”N||divi||400″ icon_color=”#c1bcc9″ image_icon_background_color=”#f2eff4″ icon_placement=”left” image_icon_width=”13px” content_max_width=”1100px” _builder_version=”4.19.4″ _module_preset=”default” header_font_size=”15px” header_line_height=”1.9em” image_icon_custom_padding=”8px|8px|8px|8px|false|false” custom_margin=”||1px|||” border_radii_image=”on|100%|100%|100%|100%” icon_font_size=”13px” use_circle=”on” circle_color=”#1aa325″ global_colors_info=”{}” image_icon_background_color__sticky_enabled=”#2ea3f2″ image_icon_background_color__sticky=”#2ea3f2″ theme_builder_area=”post_content”][\/et_pb_blurb][et_pb_blurb title=”Add image overlay” use_icon=”on” font_icon=”N||divi||400″ icon_color=”#c1bcc9″ image_icon_background_color=”#f2eff4″ icon_placement=”left” image_icon_width=”13px” content_max_width=”1100px” _builder_version=”4.19.4″ _module_preset=”default” header_font_size=”15px” header_line_height=”1.9em” image_icon_custom_padding=”8px|8px|8px|8px|false|false” custom_margin=”||1px|||” border_radii_image=”on|100%|100%|100%|100%” icon_font_size=”13px” use_circle=”on” circle_color=”#1aa325″ global_colors_info=”{}” image_icon_background_color__sticky_enabled=”#2ea3f2″ image_icon_background_color__sticky=”#2ea3f2″ theme_builder_area=”post_content”][\/et_pb_blurb][et_pb_blurb title=”Advanced custom CSS fields” use_icon=”on” font_icon=”N||divi||400″ icon_color=”#c1bcc9″ image_icon_background_color=”#f2eff4″ icon_placement=”left” image_icon_width=”13px” content_max_width=”1100px” _builder_version=”4.19.4″ _module_preset=”default” header_font_size=”15px” header_line_height=”1.9em” image_icon_custom_padding=”8px|8px|8px|8px|false|false” custom_margin=”||1px|||” border_radii_image=”on|100%|100%|100%|100%” icon_font_size=”13px” use_circle=”on” circle_color=”#1aa325″ global_colors_info=”{}” image_icon_background_color__sticky_enabled=”#2ea3f2″ image_icon_background_color__sticky=”#2ea3f2″ theme_builder_area=”post_content”][\/et_pb_blurb][\/et_pb_column][\/et_pb_row][\/et_pb_section]\n","protected":false},"excerpt":{"rendered":"

Pamerkan foto sebelum & selepas anda dengan cara yang menakjubkan dan interaktif dengan modul Divi Pixel yang mudah digunakan ini. Gunakan Slider Sebelum & Selepas untuk memaparkan dua versi imej hanya dengan meluncur ke atasnya.Choose vertical slider orientation and drag the slider up and down to see two versions of the image.

\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t
\n\t\t\t\t\t
\n <\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":26944642,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"dipi_cpt_category":[],"class_list":["post-22990651","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/demo.fastudio.my\/divi-pixel\/wp-json\/wp\/v2\/pages\/22990651","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/demo.fastudio.my\/divi-pixel\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/demo.fastudio.my\/divi-pixel\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/demo.fastudio.my\/divi-pixel\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/demo.fastudio.my\/divi-pixel\/wp-json\/wp\/v2\/comments?post=22990651"}],"version-history":[{"count":0,"href":"https:\/\/demo.fastudio.my\/divi-pixel\/wp-json\/wp\/v2\/pages\/22990651\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/demo.fastudio.my\/divi-pixel\/wp-json\/wp\/v2\/pages\/26944642"}],"wp:attachment":[{"href":"https:\/\/demo.fastudio.my\/divi-pixel\/wp-json\/wp\/v2\/media?parent=22990651"}],"wp:term":[{"taxonomy":"dipi_cpt_category","embeddable":true,"href":"https:\/\/demo.fastudio.my\/divi-pixel\/wp-json\/wp\/v2\/dipi_cpt_category?post=22990651"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}