{"id":6,"date":"2014-10-29T14:31:41","date_gmt":"2014-10-29T14:31:41","guid":{"rendered":"http:\/\/stopdesign.cn\/demo\/?page_id=6"},"modified":"2023-03-12T04:25:58","modified_gmt":"2023-03-12T04:25:58","slug":"depth-modal","status":"publish","type":"page","link":"https:\/\/stopdesign.cn\/demo\/depth-modal\/","title":{"rendered":"Depth Modal"},"content":{"rendered":"<section class=\"wpb-content-wrapper\"><p>[vc_row css=&#8221;.vc_custom_1457885043447{padding-top: 40px !important;padding-bottom: 40px !important;}&#8221;][vc_column width=&#8221;1\/3&#8243;]<div class='avgrund-container' data-width='680' data-textcolor='#333333' data-background='#ffffff' data-loadedvisible='on' data-margintop='40' data-popupposition='fixed'><div class='avgrund-popup'>\n              <div class='avgrund-content'><div class=\"cq-ribbon-container \" style=\"max-width:;\" data-ribbonwidth=\"\" data-ribbontop=\"16px\" data-ribbonleft=\"10px\"  data-ribboncolor=\"\" data-containerbg=\"\" data-textcolor=\"\" data-textmargintop=\"\"><div class=\"cq-ribbon right\"><div class=\"cq-ribbon-bg\" style=\"background:#f04256;color:;\">label<\/div><\/div><div class=\"cq-ribbon-content\"><p class=\"cq-ribbon-text\">Here is the optional ribbon content, you can customize it in the backend editor. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione, vel commodi neque.<\/p><\/div><\/div><\/div>\n              <a href='#' class='avgrund-close'><img width='24' height='24' src='https:\/\/stopdesign.cn\/demo\/wp-content\/plugins\/vc-extensions-bundle3.6.5\/depthmodal\/img\/close.png' alt='close' \/><\/a>\n            <\/div><div class='avgrund-cover'><\/div><a href='#' class='avgrund-btn'>[vc_btn title=\"Hello button 1\" color=\"blue\" style=\"modern\" shape=\"rounded\" align=\"center\" size=\"xs\"]<\/a><\/div>[\/vc_column][vc_column width=&#8221;1\/3&#8243;]<div class='avgrund-container' data-width='60%' data-textcolor='#333333' data-background='#ffffff' data-loadedvisible='on' data-margintop='40' data-popupposition='fixed'><div class='avgrund-popup'>\n              <div class='avgrund-content'><div class=\"cqcarousel-container \" data-slidestoshow=\"5\" data-thumbstoshow=\"7\" data-dots=\"no\" data-arrows=\"yes\" data-isgallery=\"is-gallery\" data-largeimagearrows=\"yes\" data-autoplay=\"no\" data-autoplayspeed=\"4000\" data-containerwidth=\"\" data-containermaxwidth=\"\" data-imgnum=\"4\" data-bottomversion=\"\" data-dotbottom=\"\" data-lightboxmode=\"prettyphoto\"><div class=\"carousel-gallery\"><div><img src=\"https:\/\/stopdesign.cn\/demo\/wp-content\/uploads\/2014\/08\/tumblr_n98smdYLPh1qfirfao1_1280.jpg\" alt=\"\" \/><\/div><div><img src=\"https:\/\/stopdesign.cn\/demo\/wp-content\/uploads\/2014\/08\/tumblr_n98sgcjz3l1qfirfao1_1280.jpg\" alt=\"\" \/><\/div><div><img src=\"https:\/\/stopdesign.cn\/demo\/wp-content\/uploads\/2014\/08\/tumblr_n98sav8gfd1qfirfao1_1280.jpg\" alt=\"\" \/><\/div><div><img src=\"https:\/\/stopdesign.cn\/demo\/wp-content\/uploads\/2014\/08\/tumblr_n98s39IFd01qfirfao1_1280.jpg\" alt=\"\" \/><\/div><\/div><div class=\"carousel-thumb is-gallery\"><div title=\"Hi tooltip 1\"><img src=\"https:\/\/stopdesign.cn\/demo\/wp-content\/uploads\/2014\/08\/tumblr_n98smdYLPh1qfirfao1_1280.jpg\" alt=\"\" \/><\/div><div title=\"hello tooltip 2\"><img src=\"https:\/\/stopdesign.cn\/demo\/wp-content\/uploads\/2014\/08\/tumblr_n98sgcjz3l1qfirfao1_1280.jpg\" alt=\"\" \/><\/div><div title=\"I'm image 3\"><img src=\"https:\/\/stopdesign.cn\/demo\/wp-content\/uploads\/2014\/08\/tumblr_n98sav8gfd1qfirfao1_1280.jpg\" alt=\"\" \/><\/div><div title=\"I'm image 4\"><img src=\"https:\/\/stopdesign.cn\/demo\/wp-content\/uploads\/2014\/08\/tumblr_n98s39IFd01qfirfao1_1280.jpg\" alt=\"\" \/><\/div><\/div><\/div>\n<p style=\"margin-top: 14px;\">Gallery by shortcode.<\/p>\n<div class=\"cqcarousel-container \" data-slidestoshow=\"5\" data-thumbstoshow=\"7\" data-dots=\"no\" data-arrows=\"yes\" data-isgallery=\"is-gallery\" data-largeimagearrows=\"yes\" data-autoplay=\"no\" data-autoplayspeed=\"4000\" data-containerwidth=\"\" data-containermaxwidth=\"\" data-imgnum=\"4\" data-bottomversion=\"\" data-dotbottom=\"\" data-lightboxmode=\"prettyphoto\"><div class=\"carousel-gallery\"><div><img src=\"https:\/\/stopdesign.cn\/demo\/wp-content\/uploads\/2014\/08\/tumblr_n98smdYLPh1qfirfao1_1280.jpg\" alt=\"\" \/><\/div><div><img src=\"https:\/\/stopdesign.cn\/demo\/wp-content\/uploads\/2014\/08\/tumblr_n98sgcjz3l1qfirfao1_1280.jpg\" alt=\"\" \/><\/div><div><img src=\"https:\/\/stopdesign.cn\/demo\/wp-content\/uploads\/2014\/08\/tumblr_n98sav8gfd1qfirfao1_1280.jpg\" alt=\"\" \/><\/div><div><img src=\"https:\/\/stopdesign.cn\/demo\/wp-content\/uploads\/2014\/08\/tumblr_n98s39IFd01qfirfao1_1280.jpg\" alt=\"\" \/><\/div><\/div><div class=\"carousel-thumb is-gallery\"><div title=\"Hi tooltip 1\"><img src=\"https:\/\/stopdesign.cn\/demo\/wp-content\/uploads\/2014\/08\/tumblr_n98smdYLPh1qfirfao1_1280.jpg\" alt=\"\" \/><\/div><div title=\"hello tooltip 2\"><img src=\"https:\/\/stopdesign.cn\/demo\/wp-content\/uploads\/2014\/08\/tumblr_n98sgcjz3l1qfirfao1_1280.jpg\" alt=\"\" \/><\/div><div title=\"I'm image 3\"><img src=\"https:\/\/stopdesign.cn\/demo\/wp-content\/uploads\/2014\/08\/tumblr_n98sav8gfd1qfirfao1_1280.jpg\" alt=\"\" \/><\/div><div title=\"I'm image 4\"><img src=\"https:\/\/stopdesign.cn\/demo\/wp-content\/uploads\/2014\/08\/tumblr_n98s39IFd01qfirfao1_1280.jpg\" alt=\"\" \/><\/div><\/div><\/div><\/div>\n              <a href='#' class='avgrund-close'><img width='24' height='24' src='https:\/\/stopdesign.cn\/demo\/wp-content\/plugins\/vc-extensions-bundle3.6.5\/depthmodal\/img\/close.png' alt='close' \/><\/a>\n            <\/div><div class='avgrund-cover'><\/div><a href='#' class='avgrund-btn'>[vc_btn title=\"Yet another button\" color=\"blue\" style=\"modern\" shape=\"rounded\" align=\"center\" size=\"xs\"]<\/a><\/div>[\/vc_column][vc_column width=&#8221;1\/3&#8243;]<div class='avgrund-container' data-width='40%' data-textcolor='#333333' data-background='#ffffff' data-loadedvisible='off' data-margintop='100' data-popupposition='fixed'><div class='avgrund-popup'>\n              <div class='avgrund-content'><span style=\"font-size: 36px; font-weight: bold;\">I&#8217;m a title<\/span><\/p>\n<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<\/div>\n              <a href='#' class='avgrund-close'><img width='24' height='24' src='https:\/\/stopdesign.cn\/demo\/wp-content\/plugins\/vc-extensions-bundle3.6.5\/depthmodal\/img\/close.png' alt='close' \/><\/a>\n            <\/div><div class='avgrund-cover'><\/div><a href='#' class='avgrund-btn'>[vc_btn title=\"Click button to open\" color=\"orange\" style=\"modern\" shape=\"round\" align=\"center\" size=\"lg\"]<\/a><\/div>[\/vc_column][\/vc_row][vc_row css=&#8221;.vc_custom_1457885056651{padding-top: 40px !important;padding-bottom: 40px !important;}&#8221;][vc_column width=&#8221;1\/3&#8243;]<div class='avgrund-container' data-width='60%' data-textcolor='#ffffff' data-background='#f69c2e' data-loadedvisible='off' data-margintop='40' data-popupposition='fixed'><div class='avgrund-popup'>\n              <div class='avgrund-content'><span style=\"font-size: 36px; font-weight: bold;\">I&#8217;m responsive popup, width 60%<\/span><\/p>\n<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<\/div>\n              <a href='#' class='avgrund-close'><img width='24' height='24' src='https:\/\/stopdesign.cn\/demo\/wp-content\/plugins\/vc-extensions-bundle3.6.5\/depthmodal\/img\/close.png' alt='close' \/><\/a>\n            <\/div><div class='avgrund-cover'><\/div><a href='#' class='avgrund-btn'>[vc_btn title=\"Say hi\" color=\"violet\" style=\"modern\" shape=\"rounded\" align=\"center\" size=\"sm\"]<\/a><\/div>[\/vc_column][vc_column width=&#8221;1\/3&#8243;]<div class='avgrund-container' data-width='640' data-textcolor='#333' data-background='#fc685f' data-loadedvisible='off' data-margintop='40' data-popupposition='fixed'><div class='avgrund-popup'>\n              <div class='avgrund-content'><span style=\"font-size: 36px; font-weight: bold;\">Yet another title<\/span><\/p>\n<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<\/div>\n              <a href='#' class='avgrund-close'><img width='24' height='24' src='https:\/\/stopdesign.cn\/demo\/wp-content\/plugins\/vc-extensions-bundle3.6.5\/depthmodal\/img\/close.png' alt='close' \/><\/a>\n            <\/div><div class='avgrund-cover'><\/div><a href='#' class='avgrund-btn'>[vc_btn title=\"Click to open\" color=\"peacoc\" style=\"modern\" shape=\"square\" align=\"center\" size=\"sm\"]<\/a><\/div>[\/vc_column][vc_column width=&#8221;1\/3&#8243;]<div class='avgrund-container' data-width='640' data-textcolor='#ffffff' data-background='#1e73be' data-loadedvisible='off' data-margintop='40' data-popupposition='fixed'><div class='avgrund-popup'>\n              <div class='avgrund-content'><span style=\"font-size: 36px; font-weight: bold;\">I&#8217;m a title<\/span><\/p>\n<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<\/div>\n              <a href='#' class='avgrund-close'><img width='24' height='24' src='https:\/\/stopdesign.cn\/demo\/wp-content\/plugins\/vc-extensions-bundle3.6.5\/depthmodal\/img\/close.png' alt='close' \/><\/a>\n            <\/div><div class='avgrund-cover'><\/div><a href='#' class='avgrund-btn'>[vc_btn title=\"Have a nice day\" color=\"purple\" style=\"modern\" shape=\"rounded\" align=\"center\" size=\"lg\"]<\/a><\/div>[\/vc_column][\/vc_row][vc_row css=&#8221;.vc_custom_1457885066447{padding-top: 40px !important;padding-bottom: 40px !important;}&#8221;][vc_column width=&#8221;1\/3&#8243;]<div class='avgrund-container' data-width='420' data-textcolor='#333333' data-background='#ffffff' data-loadedvisible='off' data-margintop='40' data-popupposition='fixed'><div class='avgrund-popup'>\n              <div class='avgrund-content'>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<\/div>\n              <a href='#' class='avgrund-close'><img width='24' height='24' src='https:\/\/stopdesign.cn\/demo\/wp-content\/plugins\/vc-extensions-bundle3.6.5\/depthmodal\/img\/close.png' alt='close' \/><\/a>\n            <\/div><div class='avgrund-cover'><\/div><a href='#' class='avgrund-btn'>[vc_btn title=\"Different color, size and shape\" color=\"green\" style=\"modern\" shape=\"square\" align=\"center\" size=\"lg\"]<\/a><\/div>[\/vc_column][vc_column width=&#8221;1\/3&#8243;]<div class='avgrund-container' data-width='320' data-textcolor='#333' data-background='#fff' data-loadedvisible='off' data-margintop='20%' data-popupposition='fixed'><div class='avgrund-popup'>\n              <div class='avgrund-content'>I am test text block. Click edit button to change this text.<\/div>\n              <a href='#' class='avgrund-close'><img width='24' height='24' src='https:\/\/stopdesign.cn\/demo\/wp-content\/plugins\/vc-extensions-bundle3.6.5\/depthmodal\/img\/close.png' alt='close' \/><\/a>\n            <\/div><div class='avgrund-cover'><\/div><a href='#' class='avgrund-btn'>[vc_btn title=\"The button\" color=\"vista_blue\" style=\"modern\" shape=\"rounded\" align=\"center\" size=\"lg\"]<\/a><\/div>[\/vc_column][vc_column width=&#8221;1\/3&#8243;]<div class='avgrund-container' data-width='340' data-textcolor='#333' data-background='#fff' data-loadedvisible='off' data-margintop='40' data-popupposition='fixed'><div class='avgrund-popup'>\n              <div class='avgrund-content'><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-medium wp-image-31\" src=\"http:\/\/stopdesign.cn\/codecanyon\/depth-modal\/wp-content\/uploads\/sites\/25\/2014\/03\/2540078331_263003388f_b-300x199.jpg\" alt=\"2540078331_263003388f_b\" width=\"300\" height=\"199\" srcset=\"https:\/\/stopdesign.cn\/demo\/wp-content\/uploads\/2014\/03\/2540078331_263003388f_b-300x199.jpg 300w, https:\/\/stopdesign.cn\/demo\/wp-content\/uploads\/2014\/03\/2540078331_263003388f_b.jpg 1024w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/div>\n              <a href='#' class='avgrund-close'><img width='24' height='24' src='https:\/\/stopdesign.cn\/demo\/wp-content\/plugins\/vc-extensions-bundle3.6.5\/depthmodal\/img\/close.png' alt='close' \/><\/a>\n            <\/div><div class='avgrund-cover'><\/div><a href='#' class='avgrund-btn'>[vc_btn title=\"Open an image\" color=\"peacoc\" style=\"modern\" shape=\"rounded\" align=\"center\" size=\"lg\"]<\/a><\/div>[\/vc_column][\/vc_row][vc_row][vc_column][\/vc_column][\/vc_row]<\/p>\n<\/section>","protected":false},"excerpt":{"rendered":"<p>[vc_row css=&#8221;.vc_custom_1457885043447{padding-top: 40px !important;padding-bottom: 40px !important;}&#8221;][vc_column width=&#8221;1\/3&#8243;][\/vc_column][vc_column width=&#8221;1\/3&#8243;][\/vc_column][vc_column width=&#8221;1\/3&#8243;][\/vc_column][\/vc_row][vc_row css=&#8221;.vc_custom_1457885056651{padding-top: 40px !important;padding-bottom: 40px !important;}&#8221;][vc_column width=&#8221;1\/3&#8243;][\/vc_column][vc_column width=&#8221;1\/3&#8243;][\/vc_column][vc_column width=&#8221;1\/3&#8243;][\/vc_column][\/vc_row][vc_row css=&#8221;.vc_custom_1457885066447{padding-top: 40px !important;padding-bottom: 40px !important;}&#8221;][vc_column width=&#8221;1\/3&#8243;][\/vc_column][vc_column width=&#8221;1\/3&#8243;][\/vc_column][vc_column width=&#8221;1\/3&#8243;][\/vc_column][\/vc_row][vc_row][vc_column][\/vc_column][\/vc_row]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"open","ping_status":"open","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/stopdesign.cn\/demo\/wp-json\/wp\/v2\/pages\/6"}],"collection":[{"href":"https:\/\/stopdesign.cn\/demo\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/stopdesign.cn\/demo\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/stopdesign.cn\/demo\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/stopdesign.cn\/demo\/wp-json\/wp\/v2\/comments?post=6"}],"version-history":[{"count":15,"href":"https:\/\/stopdesign.cn\/demo\/wp-json\/wp\/v2\/pages\/6\/revisions"}],"predecessor-version":[{"id":4083,"href":"https:\/\/stopdesign.cn\/demo\/wp-json\/wp\/v2\/pages\/6\/revisions\/4083"}],"wp:attachment":[{"href":"https:\/\/stopdesign.cn\/demo\/wp-json\/wp\/v2\/media?parent=6"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}