{"id":175315,"date":"2026-03-03T10:16:22","date_gmt":"2026-03-03T09:16:22","guid":{"rendered":"https:\/\/undsgn.com\/uncode\/?page_id=175315"},"modified":"2026-03-03T10:16:22","modified_gmt":"2026-03-03T09:16:22","slug":"background-interactive","status":"publish","type":"page","link":"https:\/\/www.drizastudio.com\/index.php\/features\/background-interactive\/","title":{"rendered":"Background Interactive"},"content":{"rendered":"

[vc_row row_height_percent=\u00bb100″ back_color=\u00bbcolor-nhtu\u00bb back_image=\u00bb15054″ multiple_media=\u00bbyes\u00bb medias=\u00bb11299,11299,15054,2286,11297,11295,11317,11304,2286,11297,15054,11304,2440,11295,11304,11317,11295,2286,2286,15054,11299,15054,11304,11298,11295,11304,11295,2440,11306,11295,11297,11299,11306,11297,11317,11317,15054,11297,11306,2286,11297,11299,11306,11317″ bg_transition=\u00bbmagnetic\u00bb bg_shuffle=\u00bbyes\u00bb bg_resolution=\u00bb4″ bg_width=\u00bbclamp(7.8125rem, 1.1949rem + 22.0588vw, 21.875rem)\u00bb bg_m_width=\u00bbclamp(4.6875rem, 1.011rem + 12.2549vw, 12.5rem)\u00bb bg_pool=\u00bb40″ bg_blur=\u00bbyes\u00bb bg_depth=\u00bbyes\u00bb bg_no_overlap=\u00bbyes\u00bb bg_min_opacity=\u00bb25″ bg_max_opacity=\u00bb100″ bg_move_x=\u00bb30vw\u00bb bg_move_y=\u00bb30vw\u00bb bg_safe_w=\u00bb40″ bg_safe_h=\u00bb25″ overlay_alpha=\u00bb50″ gutter_size=\u00bb3″ column_width_percent=\u00bb100″ shift_y=\u00bb0″ z_index=\u00bb0″ enable_top_divider=\u00bbdefault\u00bb top_divider=\u00bbgradient\u00bb shape_top_h_use_pixel=\u00bbtrue\u00bb shape_top_height_percent=\u00bb20″ shape_top_color=\u00bbcolor-nhtu\u00bb shape_top_opacity=\u00bb100″ shape_top_index=\u00bb1″ enable_bottom_divider=\u00bbdefault\u00bb bottom_divider=\u00bbgradient\u00bb shape_bottom_h_use_pixel=\u00bbtrue\u00bb shape_bottom_height_percent=\u00bb20″ shape_bottom_color=\u00bbcolor-nhtu\u00bb shape_bottom_opacity=\u00bb100″ shape_bottom_index=\u00bb2″ content_parallax=\u00bb0″ uncode_shortcode_id=\u00bb122100″ back_color_type=\u00bbuncode-palette\u00bb bg_radius=\u00bb2px\u00bb shape_top_color_type=\u00bbuncode-palette\u00bb shape_bottom_color_type=\u00bbuncode-palette\u00bb row_name=\u00bbmagnetic-one\u00bb][vc_column column_width_percent=\u00bb100″ position_vertical=\u00bbmiddle\u00bb align_horizontal=\u00bbalign_center\u00bb gutter_size=\u00bb2″ style=\u00bbdark\u00bb overlay_alpha=\u00bb50″ shift_x=\u00bb0″ shift_y=\u00bb0″ shift_y_down=\u00bb0″ z_index=\u00bb0″ medium_width=\u00bb0″ mobile_width=\u00bb0″ width=\u00bb1\/1″ uncode_shortcode_id=\u00bb600429″ mobile_height=\u00bb600px\u00bb][vc_custom_heading text_size=\u00bbfontsize-338686″ text_space=\u00bbfontspace-111509″ uncode_shortcode_id=\u00bb103705″ el_class=\u00bbdemo-heading\u00bb]Magnetic Gallery One[\/vc_custom_heading][vc_column_text text_color=\u00bbcolor-wvjs\u00bb el_class=\u00bbdemo-lead-text\u00bb uncode_shortcode_id=\u00bb145253″ text_color_type=\u00bbuncode-palette\u00bb]Settings: Width 125-350, Count 40, Blur On, Depth On, Opacity 25-100, Move 30vw, Safe Area 40-25[\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=\u00bb100″ back_color=\u00bbcolor-xsdn\u00bb back_image=\u00bb11304″ multiple_media=\u00bbyes\u00bb medias=\u00bb11297,11304,11297,11298,11304,11297,11299,11306,11298″ bg_transition=\u00bbtrail\u00bb bg_shuffle=\u00bbyes\u00bb bg_resolution=\u00bb4″ bg_width=\u00bb140″ bg_m_width=\u00bb60″ bg_ratio=\u00bb1_1″ bg_rotate=\u00bb15″ bg_drift=\u00bbyes\u00bb bg_interval=\u00bb5″ bg_distance=\u00bb50″ bg_life=\u00bb0.1″ bg_in_anim=\u00bb0.2″ bg_out_anim=\u00bb0.8″ bg_pool=\u00bb30″ bg_mobile_interval=\u00bb500″ overlay_alpha=\u00bb50″ gutter_size=\u00bb3″ column_width_percent=\u00bb100″ shift_y=\u00bb0″ z_index=\u00bb0″ content_parallax=\u00bb0″ uncode_shortcode_id=\u00bb204786″ back_color_type=\u00bbuncode-palette\u00bb bg_radius=\u00bb4px\u00bb row_name=\u00bbmouse-trail-one\u00bb bg_z_index=\u00bb2″][vc_column column_width_percent=\u00bb100″ position_vertical=\u00bbmiddle\u00bb align_horizontal=\u00bbalign_center\u00bb gutter_size=\u00bb2″ overlay_alpha=\u00bb50″ shift_x=\u00bb0″ shift_y=\u00bb0″ shift_y_down=\u00bb0″ z_index=\u00bb0″ medium_width=\u00bb0″ mobile_width=\u00bb0″ width=\u00bb1\/1″ uncode_shortcode_id=\u00bb131436″ mobile_height=\u00bb600px\u00bb][vc_custom_heading text_color=\u00bbcolor-nhtu\u00bb text_size=\u00bbfontsize-338686″ text_space=\u00bbfontspace-111509″ uncode_shortcode_id=\u00bb115922″ el_class=\u00bbdemo-heading\u00bb text_color_type=\u00bbuncode-palette\u00bb]Mouse Trail One[\/vc_custom_heading][vc_column_text text_color=\u00bbcolor-wvjs\u00bb el_class=\u00bbdemo-lead-text\u00bb uncode_shortcode_id=\u00bb847892″ text_color_type=\u00bbuncode-palette\u00bb]Settings: Width 60-140, Ratio 1:1, Rotate 15, Interval 5, Distance 50, Drift On, Duration 0.1, In 0.2, Out 0.8[\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=\u00bb100″ override_padding=\u00bbyes\u00bb h_padding=\u00bb2″ top_padding=\u00bb2″ bottom_padding=\u00bb0″ back_color=\u00bbcolor-nhtu\u00bb back_image=\u00bb175754″ multiple_media=\u00bbyes\u00bb medias=\u00bb175754,175754,175754,175754,175754,175754,175754,175754,175754,175754,175754,175754,175754,175754,175754,137399,137399,137399,137399,137399,137399,137399,137399,137399,137399,137399″ bg_transition=\u00bbparticle\u00bb bg_shuffle=\u00bbyes\u00bb bg_resolution=\u00bb4″ bg_width=\u00bb140″ bg_m_width=\u00bb70″ bg_rotate=\u00bb25″ bg_drift=\u00bbyes\u00bb bg_interval=\u00bb200″ bg_safe_w=\u00bb60″ bg_safe_h=\u00bb40″ overlay_alpha=\u00bb50″ gutter_size=\u00bb3″ column_width_percent=\u00bb100″ shift_y=\u00bb0″ z_index=\u00bb0″ css_animation=\u00bbscroll-trigger\u00bb animate_el=\u00bbcontent\u00bb animation_state=\u00bbend\u00bb animation_scale_val=\u00bb100″ animation_opacity=\u00bb0″ animation_x=\u00bb0″ animation_y=\u00bb0″ animation_blur=\u00bb0″ animation_rotate=\u00bb0″ animation_perspective=\u00bb0″ animation_offset_top=\u00bb0″ animation_offset_bottom=\u00bb100″ content_parallax=\u00bb0″ uncode_shortcode_id=\u00bb777657″ back_color_type=\u00bbuncode-palette\u00bb row_name=\u00bbrandom-particles\u00bb][vc_column column_width_percent=\u00bb100″ position_vertical=\u00bbmiddle\u00bb align_horizontal=\u00bbalign_center\u00bb gutter_size=\u00bb2″ style=\u00bbdark\u00bb overlay_alpha=\u00bb50″ shift_x=\u00bb0″ shift_y=\u00bb0″ shift_y_down=\u00bb0″ z_index=\u00bb0″ medium_width=\u00bb0″ mobile_width=\u00bb0″ width=\u00bb1\/1″ mobile_height=\u00bb600px\u00bb uncode_shortcode_id=\u00bb138121″][vc_custom_heading text_size=\u00bbfontsize-338686″ text_space=\u00bbfontspace-111509″ uncode_shortcode_id=\u00bb525717″ el_class=\u00bbdemo-heading\u00bb]Random Particles[\/vc_custom_heading][vc_column_text text_color=\u00bbcolor-wvjs\u00bb el_class=\u00bbdemo-lead-text\u00bb uncode_shortcode_id=\u00bb560005″ text_color_type=\u00bbuncode-palette\u00bb]Settings: Width 250, Ratio 3:2, Rotate 0, Interval 50, Distance 75, Drift Off, Duration 0.5, In 0.2, Out 0.6[\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=\u00bb100″ back_color=\u00bbcolor-xsdn\u00bb back_image=\u00bb18918″ multiple_media=\u00bbyes\u00bb medias=\u00bb18916,18918,18920,18920,18920,18916,18912,18918,18918,18920,18912,18912,18912,18912,18918,18916,18918,18918,18918,18912,18916,18916,18912,18920,18916,18918,18916,18918,18912,18912,18916,18918,18912,18916,18920,18920,18912,18916,18912,18912,18920,18916,18918,18920,18912,18916,18912,18918,18920,18918,18920,18916,18918,18916,18918,18912,18912,18920,18918,18920,18916,18912″ bg_transition=\u00bbmagnetic\u00bb bg_shuffle=\u00bbyes\u00bb bg_resolution=\u00bb4″ bg_width=\u00bbclamp(6.25rem, 4.7794rem + 4.902vw, 9.375rem)\u00bb bg_m_width=\u00bbclamp(2.1875rem, 1.011rem + 3.9216vw, 4.6875rem)\u00bb bg_pool=\u00bb40″ bg_depth=\u00bbyes\u00bb bg_no_overlap=\u00bbyes\u00bb bg_min_opacity=\u00bb90″ bg_max_opacity=\u00bb100″ bg_move_x=\u00bb15vw\u00bb bg_move_y=\u00bb15vw\u00bb bg_safe_w=\u00bb65″ bg_safe_h=\u00bb35″ overlay_alpha=\u00bb50″ gutter_size=\u00bb3″ column_width_percent=\u00bb100″ shift_y=\u00bb0″ z_index=\u00bb0″ top_divider=\u00bbgradient-strong\u00bb bottom_divider=\u00bbgradient\u00bb content_parallax=\u00bb0″ uncode_shortcode_id=\u00bb756989″ back_color_type=\u00bbuncode-palette\u00bb row_name=\u00bbmagnetic-gallery-two\u00bb][vc_column column_width_percent=\u00bb100″ position_vertical=\u00bbmiddle\u00bb align_horizontal=\u00bbalign_center\u00bb gutter_size=\u00bb2″ overlay_alpha=\u00bb50″ shift_x=\u00bb0″ shift_y=\u00bb0″ shift_y_down=\u00bb0″ z_index=\u00bb0″ medium_width=\u00bb0″ mobile_width=\u00bb0″ width=\u00bb1\/1″ uncode_shortcode_id=\u00bb164357″ mobile_height=\u00bb600px\u00bb][vc_custom_heading text_color=\u00bbcolor-nhtu\u00bb text_size=\u00bbfontsize-338686″ text_space=\u00bbfontspace-111509″ uncode_shortcode_id=\u00bb156405″ el_class=\u00bbdemo-heading\u00bb text_color_type=\u00bbuncode-palette\u00bb]Magnetic Gallery Two[\/vc_custom_heading][vc_column_text text_color=\u00bbcolor-wvjs\u00bb el_class=\u00bbdemo-lead-text\u00bb uncode_shortcode_id=\u00bb107934″ text_color_type=\u00bbuncode-palette\u00bb]Settings: Width 100-150, Count 40, Blur Off, Depth On, Opacity 90-100, Move 15vw, Safe Area 65-35[\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=\u00bb100″ back_color=\u00bbcolor-nhtu\u00bb back_image=\u00bb11304″ multiple_media=\u00bbyes\u00bb medias=\u00bb11317,15054,11306,11298,15054,2440,2286,11299,11298,11306,15054,2286,11317,11298,11298,11295,11299,11304,11304,11298,11297″ bg_transition=\u00bbtrail\u00bb bg_resolution=\u00bb3″ bg_width=\u00bbclamp(9.375rem, 6.4338rem + 9.8039vw, 15.625rem)\u00bb bg_ratio=\u00bb3_2″ bg_rotate=\u00bb0″ bg_interval=\u00bb50″ bg_distance=\u00bb75″ bg_life=\u00bb0.5″ bg_in_anim=\u00bb0.3″ bg_out_anim=\u00bb0.6″ bg_pool=\u00bb30″ bg_mobile_interval=\u00bb500″ overlay_alpha=\u00bb50″ gutter_size=\u00bb3″ column_width_percent=\u00bb100″ shift_y=\u00bb0″ z_index=\u00bb0″ content_parallax=\u00bb0″ uncode_shortcode_id=\u00bb309286″ back_color_type=\u00bbuncode-palette\u00bb row_name=\u00bbmouse-trail-two\u00bb bg_z_index=\u00bb2″][vc_column column_width_percent=\u00bb100″ position_vertical=\u00bbmiddle\u00bb align_horizontal=\u00bbalign_center\u00bb gutter_size=\u00bb2″ style=\u00bbdark\u00bb overlay_alpha=\u00bb50″ shift_x=\u00bb0″ shift_y=\u00bb0″ shift_y_down=\u00bb0″ z_index=\u00bb0″ medium_width=\u00bb0″ mobile_width=\u00bb0″ width=\u00bb1\/1″ uncode_shortcode_id=\u00bb188779″ mobile_height=\u00bb600px\u00bb][vc_custom_heading text_size=\u00bbfontsize-338686″ text_space=\u00bbfontspace-111509″ uncode_shortcode_id=\u00bb115257″ el_class=\u00bbdemo-heading\u00bb]Mouse Trail Two[\/vc_custom_heading][vc_column_text text_color=\u00bbcolor-wvjs\u00bb el_class=\u00bbdemo-lead-text\u00bb uncode_shortcode_id=\u00bb152142″ text_color_type=\u00bbuncode-palette\u00bb]Settings: Width 250, Ratio 3:2, Rotate 0, Interval 50, Distance 75, Drift Off, Duration 0.5, In 0.3, Out 0.6[\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=\u00bb100″ back_color=\u00bbcolor-xsdn\u00bb back_image=\u00bb137399″ multiple_media=\u00bbyes\u00bb medias=\u00bb137399,137399,137399,137399,137399,137399,137399,137399,137399,137399,137399,137399,137399,137399,137399,137399,137399,137399,137399,137399″ bg_transition=\u00bbdrop\u00bb bg_shuffle=\u00bbyes\u00bb bg_resolution=\u00bb4″ bg_width=\u00bbclamp(5rem, 2.6471rem + 7.8431vw, 10rem)\u00bb bg_m_width=\u00bbclamp(3.125rem, 1.6544rem + 4.902vw, 6.25rem)\u00bb bg_ratio=\u00bb1_1″ bg_interval=\u00bb60″ bg_pool=\u00bb30″ bg_interactive=\u00bbdrag\u00bb bg_gravity=\u00bb20″ overlay_alpha=\u00bb50″ gutter_size=\u00bb3″ column_width_percent=\u00bb100″ shift_y=\u00bb0″ z_index=\u00bb0″ content_parallax=\u00bb0″ uncode_shortcode_id=\u00bb570613″ bg_z_index=\u00bb1″ back_color_type=\u00bbuncode-palette\u00bb row_name=\u00bbdrop-effect\u00bb][vc_column column_width_percent=\u00bb100″ position_vertical=\u00bbmiddle\u00bb align_horizontal=\u00bbalign_center\u00bb gutter_size=\u00bb2″ overlay_alpha=\u00bb50″ shift_x=\u00bb0″ shift_y=\u00bb0″ shift_y_down=\u00bb0″ z_index=\u00bb0″ medium_width=\u00bb0″ mobile_width=\u00bb0″ width=\u00bb1\/1″ uncode_shortcode_id=\u00bb178704″ mobile_height=\u00bb600px\u00bb][vc_custom_heading text_color=\u00bbcolor-nhtu\u00bb text_size=\u00bbfontsize-338686″ text_space=\u00bbfontspace-111509″ uncode_shortcode_id=\u00bb447966″ el_class=\u00bbdemo-heading\u00bb text_color_type=\u00bbuncode-palette\u00bb]Drop Effect[\/vc_custom_heading][vc_column_text text_color=\u00bbcolor-wvjs\u00bb el_class=\u00bbdemo-lead-text\u00bb uncode_shortcode_id=\u00bb175542″ text_color_type=\u00bbuncode-palette\u00bb]Settings: Width 80-160, Ratio 1:1, Interval 60, Interactive Drag, Gravity 20[\/vc_column_text][\/vc_column][\/vc_row]<\/p>\n<\/div>","protected":false},"excerpt":{"rendered":"

The Mouse Trail, Magnetic Gallery, Particles, and Drop Effect deliver fluid, motion-driven visuals that transform static pages into immersive digital experiences.<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":125,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-175315","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.drizastudio.com\/index.php\/wp-json\/wp\/v2\/pages\/175315","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.drizastudio.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.drizastudio.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.drizastudio.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.drizastudio.com\/index.php\/wp-json\/wp\/v2\/comments?post=175315"}],"version-history":[{"count":0,"href":"https:\/\/www.drizastudio.com\/index.php\/wp-json\/wp\/v2\/pages\/175315\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/www.drizastudio.com\/index.php\/wp-json\/wp\/v2\/pages\/125"}],"wp:attachment":[{"href":"https:\/\/www.drizastudio.com\/index.php\/wp-json\/wp\/v2\/media?parent=175315"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}