{"id":295,"date":"2024-06-20T15:09:07","date_gmt":"2024-06-20T18:09:07","guid":{"rendered":"https:\/\/luplo.net\/?page_id=295"},"modified":"2024-06-23T18:13:48","modified_gmt":"2024-06-23T21:13:48","slug":"scrollers","status":"publish","type":"page","link":"https:\/\/luplo.net\/index.php\/scrollers\/","title":{"rendered":"Scrollers"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"295\" class=\"elementor elementor-295\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0274ed9 e-con-full e-flex e-con e-parent\" data-id=\"0274ed9\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"dce-visibility-element-hidden dce-visibility-original-content dce-visibility-event elementor-element elementor-element-213e31c elementor-widget elementor-widget-html\" data-id=\"213e31c\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;enabled_visibility&quot;:&quot;yes&quot;,&quot;dce_visibility_selected&quot;:&quot;yes&quot;,&quot;dce_visibility_event&quot;:&quot;click&quot;}\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<script>\njQuery(document).ready(function($) {\n    \/\/ get containers\n    var mainArea = $('#main-area');\n    var col1 = $('#col-1');\n    var col2 = $('#col-2');\n    var col3 = $('#col-3');\n    var shorterCol,\n        tall1,\n        tall2;\n\n    \/\/ detect shorter column\n    if (col1.height() < col2.height()) {\n        shorterCol = col1;\n        tall1 = col2;\n        tall2 = col3;\n    } else if (col2.height() < col3.height()) {\n        shorterCol = col2;\n        tall1 = col1;\n        tall2 = col3;\n    } else {\n        shorterCol = col3;\n        tall1 = col1;\n        tall2 = col2;\n    }\n\n    \/\/ get window dimensions and main area offset from the top of the window\n    var wHeight = $(window).height();\n    var wWidth = $(window).width();\n    var mainOffset = mainArea.offset().top;\n\n    \/\/ get columns excedent height from window\n    var diff1 = shorterCol.height() - wHeight;\n    var diff2 = tall1.height() - wHeight;\n    var diff3 = tall2.height() - wHeight;\n\n    \/\/ calculate how much columns 2 and 3 must move to follow column 1\n    var ratio2 = (diff2 \/ diff1) - 1;\n    var ratio3 = (diff3 \/ diff1) - 1;\n\n    \/\/ function to translate columns\n    function onScroll() {\n        \/\/ get scrolling distance\n        var scrollTop = $(window).scrollTop();\n\n        \/\/ get distance of main area from top of the window\n        var mainStart = mainArea.offset().top - scrollTop;\n\n        \/\/ return if main area didn't reach top of window or if it reached bottom of window\n        if(mainStart > 0 || scrollTop > diff1 + mainOffset) {\n            return;\n        }\n\n        \/\/ calculate translation for taller columns\n        var translate2 = (scrollTop - mainOffset) * ratio2;\n        var translate3 = (scrollTop - mainOffset) * ratio3;\n\n        \/\/ set taller columns translation\n        tall1.css('transform', 'translateY(' + -translate2 + 'px)');\n        tall2.css('transform', 'translateY(' + -translate3 + 'px)');\n    }\n\n    \/\/ if not mobile breakpoint\n    if(wWidth > 767) {\n        \/\/ set main area height equal to shorter column\n        mainArea.css('height',shorterCol.height());\n\n        \/\/ call function on user scrolling\n        $(window).on('scroll', onScroll);\n    }\n});\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-6f61e81 e-grid e-con-boxed e-con e-child\" data-id=\"6f61e81\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2f15b3d dce_masking-none elementor-widget elementor-widget-image\" data-id=\"2f15b3d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"800\" height=\"200\" src=\"https:\/\/luplo.net\/wp-content\/uploads\/2024\/01\/luplo-logo-horz-alt.svg\" class=\"attachment-large size-large wp-image-19\" alt=\"\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-31555f1 e-flex e-con-boxed e-con e-child\" data-id=\"31555f1\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8cb296f elementor-widget elementor-widget-text-editor\" data-id=\"8cb296f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Web Design<br \/>E-commerce<br \/>E-mail Coding<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div data-dce-background-color=\"#000000\" class=\"elementor-element elementor-element-a3d1914 e-con-full e-flex e-con e-parent\" data-id=\"a3d1914\" data-element_type=\"container\" data-e-type=\"container\" id=\"main-area\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t<div class=\"elementor-element elementor-element-6e4a5d7 e-con-full e-flex e-con e-child\" data-id=\"6e4a5d7\" data-element_type=\"container\" data-e-type=\"container\" id=\"col-1\">\n\t\t<div data-dce-background-image-url=\"https:\/\/luplo.net\/wp-content\/uploads\/2024\/06\/oibem-mockup-01.jpg\" class=\"elementor-element elementor-element-26d03c7 e-flex e-con-boxed e-con e-child\" data-id=\"26d03c7\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div data-dce-background-image-url=\"https:\/\/luplo.net\/wp-content\/uploads\/2024\/06\/vintage-crt-monitor-effect-scaled.webp\" class=\"elementor-element elementor-element-7a29289 e-flex e-con-boxed e-con e-child\" data-id=\"7a29289\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div data-dce-background-image-url=\"https:\/\/luplo.net\/wp-content\/uploads\/2024\/06\/vintage-crt-monitor-effect-scaled.webp\" class=\"elementor-element elementor-element-4a23c05 e-flex e-con-boxed e-con e-child\" data-id=\"4a23c05\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-04e6f9b e-con-full e-flex e-con e-child\" data-id=\"04e6f9b\" data-element_type=\"container\" data-e-type=\"container\" id=\"col-2\">\n\t\t<div data-dce-background-image-url=\"https:\/\/luplo.net\/wp-content\/uploads\/2024\/06\/vintage-crt-monitor-effect-scaled.webp\" class=\"elementor-element elementor-element-82851a1 e-flex e-con-boxed e-con e-child\" data-id=\"82851a1\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div data-dce-background-image-url=\"https:\/\/luplo.net\/wp-content\/uploads\/2024\/06\/vintage-crt-monitor-effect-scaled.webp\" class=\"elementor-element elementor-element-9054939 e-flex e-con-boxed e-con e-child\" data-id=\"9054939\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div data-dce-background-image-url=\"https:\/\/luplo.net\/wp-content\/uploads\/2024\/06\/crescer-mockup-01.jpg\" class=\"elementor-element elementor-element-26b4e34 e-flex e-con-boxed e-con e-child\" data-id=\"26b4e34\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div data-dce-background-image-url=\"https:\/\/luplo.net\/wp-content\/uploads\/2024\/06\/vintage-crt-monitor-effect-scaled.webp\" class=\"elementor-element elementor-element-f010514 e-flex e-con-boxed e-con e-child\" data-id=\"f010514\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div data-dce-background-image-url=\"https:\/\/luplo.net\/wp-content\/uploads\/2024\/06\/vendamais-mockup-home.jpg\" class=\"elementor-element elementor-element-3e02ed9 e-flex e-con-boxed e-con e-child\" data-id=\"3e02ed9\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-bf89713 e-con-full e-flex e-con e-child\" data-id=\"bf89713\" data-element_type=\"container\" data-e-type=\"container\" id=\"col-3\">\n\t\t<div data-dce-background-image-url=\"https:\/\/luplo.net\/wp-content\/uploads\/2024\/06\/coloritta-mobile-mockup.jpg\" class=\"elementor-element elementor-element-6b37de6 e-flex e-con-boxed e-con e-child\" data-id=\"6b37de6\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div data-dce-background-image-url=\"https:\/\/luplo.net\/wp-content\/uploads\/2024\/06\/vintage-crt-monitor-effect-scaled.webp\" class=\"elementor-element elementor-element-ee6486b e-flex e-con-boxed e-con e-child\" data-id=\"ee6486b\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div data-dce-background-image-url=\"https:\/\/luplo.net\/wp-content\/uploads\/2024\/06\/vintage-crt-monitor-effect-scaled.webp\" class=\"elementor-element elementor-element-29c11f2 e-flex e-con-boxed e-con e-child\" data-id=\"29c11f2\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div data-dce-background-image-url=\"https:\/\/luplo.net\/wp-content\/uploads\/2024\/01\/luplo-logo-horz-dark.svg\" class=\"elementor-element elementor-element-7888980 e-con-full e-flex e-con e-parent\" data-id=\"7888980\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5a28ae5 elementor-invisible elementor-widget elementor-widget-button\" data-id=\"5a28ae5\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInUp&quot;}\" data-widget_type=\"button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-button-wrapper\">\n\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"#\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fab-whatsapp\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M380.9 97.1C339 55.1 283.2 32 223.9 32c-122.4 0-222 99.6-222 222 0 39.1 10.2 77.3 29.6 111L0 480l117.7-30.9c32.4 17.7 68.9 27 106.1 27h.1c122.3 0 224.1-99.6 224.1-222 0-59.3-25.2-115-67.1-157zm-157 341.6c-33.2 0-65.7-8.9-94-25.7l-6.7-4-69.8 18.3L72 359.2l-4.4-7c-18.5-29.4-28.2-63.3-28.2-98.2 0-101.7 82.8-184.5 184.6-184.5 49.3 0 95.6 19.2 130.4 54.1 34.8 34.9 56.2 81.2 56.1 130.5 0 101.8-84.9 184.6-186.6 184.6zm101.2-138.2c-5.5-2.8-32.8-16.2-37.9-18-5.1-1.9-8.8-2.8-12.5 2.8-3.7 5.6-14.3 18-17.6 21.8-3.2 3.7-6.5 4.2-12 1.4-32.6-16.3-54-29.1-75.5-66-5.7-9.8 5.7-9.1 16.3-30.3 1.8-3.7.9-6.9-.5-9.7-1.4-2.8-12.5-30.1-17.1-41.2-4.5-10.8-9.1-9.3-12.5-9.5-3.2-.2-6.9-.2-10.6-.2-3.7 0-9.7 1.4-14.8 6.9-5.1 5.6-19.4 19-19.4 46.3 0 27.3 19.9 53.7 22.6 57.4 2.8 3.7 39.1 59.7 94.8 83.8 35.2 15.2 49 16.5 66.6 13.9 10.7-1.6 32.8-13.4 37.4-26.4 4.6-13 4.6-24.1 3.2-26.4-1.3-2.5-5-3.9-10.5-6.6z\"><\/path><\/svg>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Entre em contato<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Web DesignE-commerceE-mail Coding Entre em contato<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-295","page","type-page","status-publish","hentry"],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/luplo.net\/index.php\/wp-json\/wp\/v2\/pages\/295","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/luplo.net\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/luplo.net\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/luplo.net\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/luplo.net\/index.php\/wp-json\/wp\/v2\/comments?post=295"}],"version-history":[{"count":286,"href":"https:\/\/luplo.net\/index.php\/wp-json\/wp\/v2\/pages\/295\/revisions"}],"predecessor-version":[{"id":600,"href":"https:\/\/luplo.net\/index.php\/wp-json\/wp\/v2\/pages\/295\/revisions\/600"}],"wp:attachment":[{"href":"https:\/\/luplo.net\/index.php\/wp-json\/wp\/v2\/media?parent=295"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}