{"id":12093,"date":"2016-12-27T13:26:31","date_gmt":"2016-12-27T13:26:31","guid":{"rendered":"http:\/\/nativewptheme.net\/support\/?p=12093"},"modified":"2017-02-15T14:42:09","modified_gmt":"2017-02-15T14:42:09","slug":"slide-parallax","status":"publish","type":"post","link":"https:\/\/nativewptheme.net\/support\/wpbakery\/slide-parallax","title":{"rendered":"Slide Parallax"},"content":{"rendered":"<section class=\"wpb-content-wrapper\"><p>[vc_row][vc_column css=&#8221;.vc_custom_1485963458300{padding-right: 35px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]Create the\u00a0amazing effect of two images overlapping each other with a slider to unleash the hidden one.<\/p>\n<p>You may check the module examples <a href=\"http:\/\/nativewptheme.net\/shortcodes\/slide-parallax\/\" target=\"_blank\">here<\/a>.<\/p>\n<h5>Watch the video tutorial on <a href=\"https:\/\/youtu.be\/eKUlcYUf4Ro\" target=\"_blank\">Slide Parallax module creation<\/a> for more details.<\/h5>\n<p>[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][dfd_tta_tabs border_radius=&#8221;4&#8243; alignment=&#8221;left&#8221; active_section=&#8221;1&#8243; active_tab_background=&#8221;#3b55e6&#8243; tab_hover_text_color=&#8221;#3b55e6&#8243; tab_active_color_text=&#8221;#ffffff&#8221; border_color_active=&#8221;#3b55e6&#8243;][vc_tta_section title=&#8221;General settings&#8221; tab_id=&#8221;1486545572585-2437c7e1-5371&#8243;][vc_column_text]<\/p>\n<h3>General settings<\/h3>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone wp-image-1780 size-full\" src=\"http:\/\/nativewptheme.net\/support\/wp-content\/uploads\/2016\/12\/General-9.jpg\" width=\"978\" height=\"556\" srcset=\"https:\/\/nativewptheme.net\/support\/wp-content\/uploads\/2016\/12\/General-9.jpg 978w, https:\/\/nativewptheme.net\/support\/wp-content\/uploads\/2016\/12\/General-9-300x171.jpg 300w, https:\/\/nativewptheme.net\/support\/wp-content\/uploads\/2016\/12\/General-9-768x437.jpg 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Direction<\/strong> &#8211;\u00a0select the direction to slide the images.\n<ul>\n<li><strong>Horizontal<\/strong> &#8211; the images will be sliding horizontally.<\/li>\n<li><strong>Vertical<\/strong> &#8211;\u00a0the images will be sliding vertically.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<h5>Extra features<\/h5>\n<ul>\n<li><strong>Animation<\/strong> \u2013 choose between 14 preset animation effects.<\/li>\n<li><strong>Custom CSS class<\/strong> \u2013\u00a0enter our\u00a0own unique class name for the item \u2013 this is a useful option for those who want to create a specific style. E.g.: you can type <strong>custom-style<\/strong> class and then go to <del class=\"support-arrow-right\">Theme options<\/del>\u00a0<del class=\"support-arrow-right\">General options<\/del>\u00a0<del class=\"support-arrow-right\">Custom CSS\/JS<\/del> <del>Custom CSS<\/del> field and write your own CSS code with this class to get your own style.<\/li>\n<\/ul>\n<p>[\/vc_column_text][\/vc_tta_section][vc_tta_section title=&#8221;Image settings&#8221; tab_id=&#8221;1486545572829-e1c1304c-ee12&#8243;][vc_column_text]<\/p>\n<h3>Images settings<\/h3>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone wp-image-1784 size-full\" src=\"http:\/\/nativewptheme.net\/support\/wp-content\/uploads\/2016\/12\/Images.jpg\" width=\"978\" height=\"396\" srcset=\"https:\/\/nativewptheme.net\/support\/wp-content\/uploads\/2016\/12\/Images.jpg 978w, https:\/\/nativewptheme.net\/support\/wp-content\/uploads\/2016\/12\/Images-300x121.jpg 300w, https:\/\/nativewptheme.net\/support\/wp-content\/uploads\/2016\/12\/Images-768x311.jpg 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>First image<\/strong> &#8211; upload the first image for the module.<\/li>\n<li><strong>Second image<\/strong> &#8211;\u00a0upload the second image which will change the first one for the module.<\/li>\n<\/ul>\n<h5>Images size<\/h5>\n<ul>\n<li><strong>Image width<\/strong> &#8211; set the width for the images.<\/li>\n<li><strong>Image height<\/strong> &#8211; set the width for the images.<\/li>\n<\/ul>\n<p>[\/vc_column_text][\/vc_tta_section][vc_tta_section title=&#8221;Divider settings&#8221; tab_id=&#8221;1486545573068-02c117a6-3d50&#8243;][vc_column_text]<\/p>\n<h3>Divider settings<\/h3>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone wp-image-1786 size-full\" src=\"http:\/\/nativewptheme.net\/support\/wp-content\/uploads\/2016\/12\/Divider.jpg\" width=\"978\" height=\"309\" srcset=\"https:\/\/nativewptheme.net\/support\/wp-content\/uploads\/2016\/12\/Divider.jpg 978w, https:\/\/nativewptheme.net\/support\/wp-content\/uploads\/2016\/12\/Divider-300x95.jpg 300w, https:\/\/nativewptheme.net\/support\/wp-content\/uploads\/2016\/12\/Divider-768x243.jpg 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Divider image<\/strong> &#8211; upload the image which will be set as the divider between the images.<\/li>\n<li><strong>Delimiter width<\/strong> &#8211; set the width for the divider between the images.<\/li>\n<li><strong>Delimiter color<\/strong> &#8211; set the delimiter color for the images. The default color is not set for this element.<\/li>\n<\/ul>\n<p>[\/vc_column_text][\/vc_tta_section][\/dfd_tta_tabs][\/vc_column][\/vc_row]<\/p>\n<\/section>","protected":false},"excerpt":{"rendered":"<p>Create the amazing effect of two images overlapping each other with a slider to unleash the hidden one.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[5],"tags":[17,24,22,33],"_links":{"self":[{"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/posts\/12093"}],"collection":[{"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/comments?post=12093"}],"version-history":[{"count":4,"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/posts\/12093\/revisions"}],"predecessor-version":[{"id":12104,"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/posts\/12093\/revisions\/12104"}],"wp:attachment":[{"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/media?parent=12093"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/categories?post=12093"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/tags?post=12093"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}