{"id":208,"date":"2024-11-12T22:14:24","date_gmt":"2024-11-12T21:14:24","guid":{"rendered":"https:\/\/henris-immo.sk\/?page_id=208"},"modified":"2024-11-12T22:39:23","modified_gmt":"2024-11-12T21:39:23","slug":"pointer-party-2","status":"publish","type":"page","link":"https:\/\/henris-immo.sk\/hu\/pointer-party-2\/","title":{"rendered":"Mintaoldal"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"208\" class=\"elementor elementor-208\" data-elementor-post-type=\"page\">\n\t\t\t\t<div data-dce-background-overlay-color=\"#0000004D\" data-dce-background-image-url=\"https:\/\/henris-immo.sk\/wp-content\/uploads\/2024\/11\/hero.jpeg\" class=\"elementor-element elementor-element-376c3fd e-flex e-con-boxed e-con e-parent\" data-id=\"376c3fd\" data-element_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<div class=\"elementor-element elementor-element-4a64181 elementor-widget elementor-widget-heading\" data-id=\"4a64181\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h1 class=\"elementor-heading-title elementor-size-default\">Praesent varius et tellus<\/h1>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-85def7b elementor-widget__width-initial elementor-widget elementor-widget-text-editor\" data-id=\"85def7b\" data-element_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>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.f<\/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<div class=\"elementor-element elementor-element-778794d e-flex e-con-boxed e-con e-parent\" data-id=\"778794d\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-aa729f1 elementor-widget elementor-widget-html\" data-id=\"aa729f1\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/gsap\/3.12.2\/gsap.min.js\"><\/script>\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/gsap\/3.12.2\/ScrollTrigger.min.js\"><\/script>\n\n<script>\n  document.addEventListener(\"DOMContentLoaded\", function () {\n    \/\/ Selecting the sticky section and other sections\n    const slide1 = document.querySelector(\"#slide-1\");\n    const slide2 = document.querySelector(\"#slide-2\");\n    const slide3 = document.querySelector(\"#slide-3\");\n\n    \/\/ Heading and paragraph inside the sticky section\n    const heading = slide1.querySelector(\"h2\");\n    const paragraph = slide1.querySelector(\"p\");\n\n    \/\/ Initialize ScrollTrigger\n    ScrollTrigger.create({\n      trigger: \"#slide-1\",\n      start: \"top top\",  \/\/ Trigger when the first section hits the top\n      end: \"bottom top\", \/\/ Trigger when the first section leaves the top\n      scrub: true, \/\/ Enable smooth scrolling with scrub\n      onUpdate: (self) => updateContent(self.progress),\n      markers: false\n    });\n\n    function updateContent(progress) {\n      \/\/ Dynamically change the background color based on scroll progress\n      slide1.style.backgroundColor = getBackground(progress);\n\n      \/\/ Change the text content based on scroll progress\n      if (progress > 0.33 && progress <= 0.66) {\n        updateSectionContent(slide2);\n      } else if (progress > 0.66) {\n        updateSectionContent(slide3);\n      } else {\n        \/\/ Default content (initial heading and paragraph)\n        heading.textContent = \"Praesent varius et tellus\";\n        paragraph.textContent = \"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\";\n      }\n\n      \/\/ Fade-in effect for text\n      gsap.to(heading, { opacity: progress, duration: 0.5 });\n      gsap.to(paragraph, { opacity: progress, duration: 0.5 });\n    }\n\n    \/\/ Function to get the background color of each section\n    function getBackground(progress) {\n      if (progress > 0.33 && progress <= 0.66) {\n        return getComputedStyle(slide2).backgroundColor || \"#e0e0e0\";\n      } else if (progress > 0.66) {\n        return getComputedStyle(slide3).backgroundColor || \"#c0c0c0\";\n      } else {\n        return \"#f0f0f0\"; \/\/ Default background for the first section\n      }\n    }\n\n    \/\/ Function to update text and background content from the selected section\n    function updateSectionContent(section) {\n      const newHeading = section.querySelector(\"h2\").textContent;\n      const newParagraph = section.querySelector(\"p\").textContent;\n      const newBackground = getComputedStyle(section).backgroundColor;\n\n      heading.textContent = newHeading;\n      paragraph.textContent = newParagraph;\n      slide1.style.backgroundColor = newBackground;\n\n      \/\/ Make text fade in\n      gsap.to(heading, { opacity: 1, duration: 0.5 });\n      gsap.to(paragraph, { opacity: 1, duration: 0.5 });\n    }\n  });\n<\/script>\n\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<div data-dce-background-overlay-color=\"#0000004D\" data-dce-background-image-url=\"https:\/\/henris-immo.sk\/wp-content\/uploads\/2024\/11\/slide1-DEE59875-8221-4818-AD90-DB58C4D1403F.jpg\" class=\"elementor-element elementor-element-1f49f9c e-flex e-con-boxed e-con e-parent\" data-id=\"1f49f9c\" data-element_type=\"container\" id=\"slide-1\" 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<div class=\"elementor-element elementor-element-c416f87 elementor-widget elementor-widget-heading\" data-id=\"c416f87\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">gyakorl\u00e1s<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-745f3a1 elementor-widget__width-initial elementor-widget elementor-widget-text-editor\" data-id=\"745f3a1\" data-element_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>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.f<\/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<div data-dce-background-overlay-color=\"#0000004D\" data-dce-background-image-url=\"https:\/\/henris-immo.sk\/wp-content\/uploads\/2024\/11\/hero.jpeg\" class=\"elementor-element elementor-element-179ea15 e-flex e-con-boxed e-con e-parent\" data-id=\"179ea15\" data-element_type=\"container\" id=\"slide-2\" 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<div class=\"elementor-element elementor-element-9a15848 elementor-widget elementor-widget-heading\" data-id=\"9a15848\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Praesent varius et tellus<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0ffe930 elementor-widget__width-initial elementor-widget elementor-widget-text-editor\" data-id=\"0ffe930\" data-element_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>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.f<\/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<div data-dce-background-overlay-color=\"#0000004D\" data-dce-background-image-url=\"https:\/\/henris-immo.sk\/wp-content\/uploads\/2024\/11\/hero.jpeg\" class=\"elementor-element elementor-element-b2ae1bf e-flex e-con-boxed e-con e-parent\" data-id=\"b2ae1bf\" data-element_type=\"container\" id=\"slide-3\" 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<div class=\"elementor-element elementor-element-3cf7919 elementor-widget elementor-widget-heading\" data-id=\"3cf7919\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Praesent varius et tellus<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-881d320 elementor-widget__width-initial elementor-widget elementor-widget-text-editor\" data-id=\"881d320\" data-element_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>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.f<\/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<div class=\"elementor-element elementor-element-0c7cf0e e-flex e-con-boxed e-con e-parent\" data-id=\"0c7cf0e\" data-element_type=\"container\">\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 class=\"elementor-element elementor-element-c2f5c5e e-flex e-con-boxed e-con e-parent\" data-id=\"c2f5c5e\" data-element_type=\"container\">\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>","protected":false},"excerpt":{"rendered":"<p>Praesent varius et tellus Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.f exercitation Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.f Praesent varius et tellus Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit [&hellip;]<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"open","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-208","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/henris-immo.sk\/hu\/wp-json\/wp\/v2\/pages\/208","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/henris-immo.sk\/hu\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/henris-immo.sk\/hu\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/henris-immo.sk\/hu\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/henris-immo.sk\/hu\/wp-json\/wp\/v2\/comments?post=208"}],"version-history":[{"count":57,"href":"https:\/\/henris-immo.sk\/hu\/wp-json\/wp\/v2\/pages\/208\/revisions"}],"predecessor-version":[{"id":266,"href":"https:\/\/henris-immo.sk\/hu\/wp-json\/wp\/v2\/pages\/208\/revisions\/266"}],"wp:attachment":[{"href":"https:\/\/henris-immo.sk\/hu\/wp-json\/wp\/v2\/media?parent=208"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}