{"id":3578,"date":"2024-02-19T10:46:13","date_gmt":"2024-02-19T09:46:13","guid":{"rendered":"https:\/\/xn--smnexperten-rfb.se\/?page_id=3578"},"modified":"2024-02-19T10:46:14","modified_gmt":"2024-02-19T09:46:14","slug":"quiz","status":"publish","type":"page","link":"https:\/\/xn--smnexperten-rfb.se\/sv\/quiz\/","title":{"rendered":"Quiz"},"content":{"rendered":"<style>\n\t\t\t.result-products-container{\n\t\t\tmax-width:1000px;\n\t\t\tmargin:0 auto;\n\t\t\tpadding:50px;\n\t\t\t}\n\t\t\t.result-products{\n\t\t\tdisplay:flex;\n\t\t\talign-items:center;\n\t\t\tjustify-content:space-between;\n\t\t\tpadding:50px;\n\t\t\twidth:100%;\n\t\t\t}\n\t\t\t.result-products .result-product{\n\t\t\t\tflex-basis:45%;\n\t\t\t\ttext-align:center;\n\t\t\t\tpadding:50px;\n\t\t\t\tborder:1px solid rgba(0,0,0,.3);\n\t\t\t\tborder-radius:14px;\n\t\t\t}\n\t\t\t.result-products .result-product .product-logo{\n\t\t\t\tdisplay:flex;\n\t\t\t\tjustify-content:center;\n\t\t\t\ttext-align:center;\n\t\t\t}\n\t\t\t.result-products .result-product .product-image{\n\t\t\t\tborder: 1px solid rgba(0, 0, 0, .1);\n   \t\t\t    border-radius: 10px;\n\t\t\t}\n\t\t\t.result-products .result-product .product-image img{\n\t\t\t\twidth:100%;\n\t\t\t\theight:120px;\n\t\t\t\tobject-fit:cover;\n\t\t\t\tborder-radius:10px;\n\t\t\t}\n\t\t\t.result-products .result-product h2{\n\t\t\t\tfont-size:20px;\n\t\t\t}\n\t\t\t.result-products .result-product ul{\n\t\t\t\ttext-align:left;\n\t\t\t}\n\t\t\t.start-over-btn{\n\t\t\ttext-align:center;\n\t\t\tmargin-top:50px;\n\t\t\t}\n\t\t\t.start-over-btn a{\n\t\t\t\tbackground:#344784;\n\t\t\t\tpadding:15px;\n\t\t\t\tcolor:#ffffff!important;\n\t\t\t\ttext-decoration:none;\n\t\t\t\tborder-radius:7px;\n\t\t\t}\n\t\t\t.result-product .shop-now-btn{\n\t\t\t\tbackground:#344784;\n\t\t\t\tpadding:10px 15px;\n\t\t\t\tcolor:#ffffff!important;\n\t\t\t\ttext-decoration:none;\n\t\t\t\tborder-radius:7px;\n\t\t\t}\n\t\t\t@media(max-width:767px){\n\t\t\t\t.quiz{\n\t\t\t\t\tpadding:50px 10px!important;\n\t\t\t\t}\n\t\t\t\t.quiz .question .options .answer-text img{\n\t\t\t\t\tdisplay:none;\n\t\t\t\t}\n\t\t\t\t.quiz .answer-text span{\n\t\t\t\t\tfont-size: 15px!important;\n\t\t\t\t}\n\t\t\t\t.quiz .answer-text{\n\t\t\t\t\tjustify-content:center!important;\n\t\t\t\t\tpadding:8px 8px!important;\n\t\t\t\t\ttext-align:center;\n\t\t\t\t}\n\t\t\t\t.quiz .question .options .option{\n\t\t\t\t\tborder-radius: 10px!important;\n\t\t\t\t}\n\t\t\t\t.quiz .question h2{\n\t\t\t\t\tfont-size:20px;\n\t\t\t\t}\n\t\t\t\t.quiz .question .options .option{\n\t\t\t\t\tflex-basis: 100%!important;\n\t\t\t\t\tmargin-bottom:15px;\n\t\t\t\t}\n\t\t\t\t.quiz .question .options{\n\t\t\t\t\tflex-wrap:wrap!important;\n\t\t\t\t\tjustify-content:center!important;\n\t\t\t\t\tgap:10px;\n\t\t\t\t}\n\t\t\t\t.result-products{\n\t\t\tdisplay:block!important;\n\t\t\t}\n\t\t\t\t.result-products-container{\n\t\t\t\t\tpadding:0px;\n\t\t\t\t}\n\t\t\t}\n\t\t<\/style>\n                <style>\n\t\t\t.quiz{\n\t\t\t\tmax-width:1200px;\n\t\t\t\twidth:100%;\n\t\t\t\tmargin:0 auto;\n\t\t\t\tbackground:#f4faff;\n\t\t\t\tpadding:50px 50px;\n\t\t\t\tmargin-top:50px;\n\t\t\t\tmargin-bottom:50px;\n\t\t\t\tborder-radius:20px;\n\t\t\t}\n            .quiz .question{\n                opacity:0;\n                height:0px;\n                overflow:hidden;\n\t\t\t\ttransition:1s all;\n            }\n\t\t\t.quiz .question h2{\n\t\t\t\ttext-align:center;\n\t\t\t}\n            .quiz .question.active{\n                opacity:1;\n                height:auto;\n            }\n            .quiz .question .options{\n                display:flex;\n                justify-content:space-between;\n\t\t\t\tmargin-top:20px;\n            }\n            .quiz .question .options .option{\n                cursor: pointer;\n                flex-basis:32%;\n\t\t\t\tbackground:#ffffff;\n\t\t\t\tborder-radius:22px;\n\t\t\t\toverflow:hidden;\n            }\n            .quiz .question .options img{\n                max-width:100%;\n\t\t\t\theight:200px;\n\t\t\t\tobject-fit:cover;\n            }\n\t\t\t.quiz .answer-text{\n\t\t\t\tdisplay:flex;\n\t\t\t\talign-items:center;\n\t\t\t\tjustify-content:space-between;\n\t\t\t\tpadding:20px 20px;\n\t\t\t}\n\t\t\t.quiz .question .options .answer-text img{\n\t\t\t\twidth:45px;\n\t\t\t\theight:auto;\n\t\t\t}\n\t\t\t.quiz .answer-text span{\n\t\t\t\t    font-size: 22px;\n\t\t\t\t\tfont-weight: 700;\n\t\t\t\t\tline-height: 26px;\n\t\t\t\t\tletter-spacing: 0;\n\t\t\t\t\tcolor: inherit;\n\t\t\t}\n\t\t\t.progress-bar-holder{\n\t\t\t\twidth:100%;\n\t\t\t\tmax-width:600px;\n\t\t\t\tborder-radius:20px;\n\t\t\t\theight:10px;\n\t\t\t\tbackground:#ffffff;\n\t\t\t\tmargin:0 auto;\n\t\t\t\toverflow:hidden;\n\t\t\t\tmargin-top:50px;\n\t\t\t}\n\t\t\t\n\t\t\t.progress-bar{\n\t\t\t\theight:10px;\n\t\t\t\tbackground:#344784;\n\t\t\t\ttransition:.5s all;\n\t\t\t}\n\t\t\t.back-btn{\n\t\t\ttext-align: center;\n\t\t\tcursor: pointer;\n\t\t\tfont-size: 24px;\n\t\t\twidth: 150px;\n\t\t\tmargin: 20px auto;\n\t\t\tcolor:#344784;\n\t\t\t}\n\t\t\t\n\t\t\t\n\t\t\t\n        <\/style>\n        <div class=\"quiz\">\n            <!--question 1-->\n            <div class=\"question active\" id=\"question1\" data-question=\"1\">\n                <h2>I vilken position sover du i?<\/h2>\n                <div class=\"options\">\n                    <div class=\"option\" id=\"q1o1\" data-value=\"1\">\n                        <img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/03\/Sida.png\">\n\t\t\t\t\t\t<div class=\"answer-text\">\n\t\t\t\t\t\t\t<span>Sida<\/span>\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/02\/position-side-icon.png\">\n\t\t\t\t\t\t<\/div>\n                        \n                    <\/div>\n                    <div class=\"option\" id=\"q1o2\" data-value=\"2\">\n                        <img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/03\/Rygg.png\">\n                        <div class=\"answer-text\">\n\t\t\t\t\t\t\t<span>Rygg<\/span>\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/02\/position-back-icon.png\">\n\t\t\t\t\t\t<\/div>\n                    <\/div>\n                    <div class=\"option\" id=\"q1o3\" data-value=\"3\">\n                        <img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/03\/Mage.png\" >\n                        <div class=\"answer-text\">\n\t\t\t\t\t\t\t<span>Mage<\/span>\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/02\/position-stomach-icon.png\">\n\t\t\t\t\t\t<\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n            \n            <!--question 2-->\n            <div class=\"question\" id=\"question2\" data-question=\"2\">\n                <h2>Upplever du n\u00e5gon sm\u00e4rta n\u00e4r du sover?<\/h2>\n                <div class=\"options\">\n                    <div class=\"option\" id=\"q2o1\" data-value=\"1\">\n                        <img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/03\/Nedre-rygg.png\">\n\t\t\t\t\t\t<div class=\"answer-text\">\n\t\t\t\t\t\t\t<span>Rygg eller i Sida<\/span>\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/02\/position-stomach-icon.png\">\n\t\t\t\t\t\t<\/div>\n                    <\/div>\n                    <div class=\"option\" id=\"q2o2\" data-value=\"2\">\n                        <img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/03\/Axel.png\">\n\t\t\t\t\t\t<div class=\"answer-text\">\n\t\t\t\t\t\t\t<span>Nack eller Axel<\/span>\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/02\/position-stomach-icon.png\">\n\t\t\t\t\t\t<\/div>\n                    <\/div>\n                    <div class=\"option\" id=\"q2o3\" data-value=\"3\">\n                        <img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/03\/Skadefri.png\">\n\t\t\t\t\t\t<div class=\"answer-text\">\n\t\t\t\t\t\t\t<span>Inga sm\u00e4rtor under s\u00f6mnen<\/span>\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/02\/position-stomach-icon.png\">\n\t\t\t\t\t\t<\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n            <!--question 3-->\n            <div class=\"question\" id=\"question3\" data-question=\"3\">\n                <h2>Vilken fasthet\/h\u00e5rdhet f\u00f6redrar du?<\/h2>\n                <div class=\"options\">\n\t\t\t\t\t\n\t\t\t\t\t<div class=\"option\" id=\"q3o1\" data-value=\"1\">\n                        <img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/03\/Mjuk.png\" alt=\"Berlin\">\n\t\t\t\t\t\t<div class=\"answer-text\">\n\t\t\t\t\t\t\t <span>Mjuk<\/span>\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/02\/position-stomach-icon.png\">\n\t\t\t\t\t\t<\/div>\n                    <\/div>\n                    \n\t\t\t\t\t<div class=\"option\" id=\"q3o2\" data-value=\"2\">\n                        <img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/03\/Medium.png\" alt=\"London\">\n\t\t\t\t\t\t<div class=\"answer-text\">\n\t\t\t\t\t\t\t<span>Medium<\/span>\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/02\/position-stomach-icon.png\">\n\t\t\t\t\t\t<\/div>\n                    <\/div>\n\t\t\t\t\t\n\t\t\t\t\t<div class=\"option\" id=\"q3o3\" data-value=\"3\">\n                        <img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/03\/Fast.png\" alt=\"Paris\">\n\t\t\t\t\t\t<div class=\"answer-text\">\n\t\t\t\t\t\t\t<span>Fast<\/span>\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/02\/position-stomach-icon.png\">\n\t\t\t\t\t\t<\/div>\n                    <\/div>\n\t\t\t\t\t\n                <\/div>\n            <\/div>\n\n            <!--question 4-->\n            <div class=\"question\" id=\"question4\" data-question=\"4\">\n                <h2>Vilken budget har du?<\/h2>\n                <div class=\"options\">\n                    <div class=\"option\" id=\"q4o1\" data-value=\"1\">\n                        <img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/03\/Budget-Madrass-1.png\" alt=\"Paris\">\n\t\t\t\t\t\t<div class=\"answer-text\">\n\t\t\t\t\t\t\t <span>Pl\u00e5nboksv\u00e4nlig <br>(upp till 8 000kr)<\/span>\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"\">\n\t\t\t\t\t\t<\/div>\n                    <\/div>\n                    <div class=\"option\" id=\"q4o2\" data-value=\"2\">\n                        <img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/03\/Mellan-Madrass-1.png\" alt=\"London\">\n\t\t\t\t\t\t<div class=\"answer-text\">\n\t\t\t\t\t\t\t <span>Mittemellan <br>(8 000-18 000kr)<\/span>\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"\">\n\t\t\t\t\t\t<\/div>\n                    <\/div>\n\t\t\t\t\t<div class=\"option\" id=\"q4o2\" data-value=\"3\">\n                        <img decoding=\"async\" src=\"http:\/\/xn--smnexperten-rfb.se\/wp-content\/uploads\/2024\/03\/Exklusiv-Madrass-1.png\" alt=\"London\">\n\t\t\t\t\t\t<div class=\"answer-text\">\n\t\t\t\t\t\t\t <span>Exklusivt <br>(mer \u00e4n 18 000kr)<\/span>\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"\">\n\t\t\t\t\t\t<\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n            <div class=\"result\" id=\"result\">\n\n            <\/div>\n\t\t\t\n\t\t\t<div class=\"progress-bar-holder\">\n\t\t\t\t\t<div class=\"progress-bar\" style=\"width:0%;\">\n\n\t\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t\t<div class=\"back-btn\">\n\t\t\t\t&larr; Tillbaka\n\t\t\t<\/div>\n        <\/div>\n            <script>\n                let q1Answer=\"\";\n                let q2Answer=\"\";\n                let q3Answer=\"\";\n                let q4Answer=\"\";\n\t\t\t\tlet progressBar = document.querySelector(\".progress-bar\");\n\t\t\t\tlet backBtn = document.querySelector(\".back-btn\");\n                \n\t\t\t\t\/\/question 1\n                const q1Options = document.querySelectorAll(\"#question1 .option\");\n                q1Options.forEach(function(q1Option){\n                    q1Option.addEventListener(\"click\",function(e){\n                        q1Answer = this.getAttribute('data-value');\n                        const q1 = document.getElementById(\"question1\");\n                        const q2 = document.getElementById(\"question2\");\n                        q1.classList.remove(\"active\");\n                        q2.classList.add(\"active\");\n\t\t\t\t\t\tprogressBar.style.width = \"25%\";\n                    });\n                });\n                \/\/question 2\n                const q2Options = document.querySelectorAll(\"#question2 .option\");\n                q2Options.forEach(function(q2Option){\n                    q2Option.addEventListener(\"click\",function(e){\n                        q2Answer = this.getAttribute('data-value');\n                        const q2 = document.getElementById(\"question2\");\n                        const q3 = document.getElementById(\"question3\");\n                        q2.classList.remove(\"active\");\n                        q3.classList.add(\"active\");\n\t\t\t\t\t\tprogressBar.style.width = \"50%\";\n                    });\n                });\n                \/\/question 3\n                const q3Options = document.querySelectorAll(\"#question3 .option\");\n                console.log(q3Options);\n                q3Options.forEach(function(q3Option){\n                    console.log(q3Option);\n                    q3Option.addEventListener(\"click\",function(e){\n                        console.log(\"hello\");\n                        q3Answer = this.getAttribute('data-value');\n                        const q3 = document.getElementById(\"question3\");\n                        const q4 = document.getElementById(\"question4\");\n                        q3.classList.remove(\"active\");\n                        q4.classList.add(\"active\");\n\t\t\t\t\t\tprogressBar.style.width = \"75%\";\n                    });\n                });\n                \/\/question 4\n                const q4Options = document.querySelectorAll(\"#question4 .option\");\n                q4Options.forEach(function(q4Option){\n                    q4Option.addEventListener(\"click\",function(e){\n                        q4Answer = this.getAttribute('data-value');\n                        const q4 = document.getElementById(\"question4\");\n                        const result = document.getElementById(\"result\");\n\t\t\t\t\t\tprogressBar.style.width = \"100%\";\n\t\t\t\t\t\t\n\t\t\t\t\t\tconst myTimeout = setTimeout(myGreeting, 700);\n\n\t\t\t\t\t\tfunction myGreeting() {\n\t\t\t\t\t\t  \tq4.classList.remove(\"active\");\n\t\t\t\t\t\t\tvar resultComb = q1Answer + q2Answer + q3Answer + q4Answer;\n\t\t\t\t\t\t\tvar currentUrl = window.location.href;\n\t\t\t\t\t\t\tvar alteredUrl = removeParam(\"result\",currentUrl);\n\t\t\t\t\t\t\tlocation.href = alteredUrl+\"?result=\"+resultComb;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n                        \n                    });\n                });\n                function removeParam(key, sourceURL) {\n                    var rtn = sourceURL.split(\"?\")[0],\n                        param,\n                        params_arr = [],\n                        queryString = (sourceURL.indexOf(\"?\") !== -1) ? sourceURL.split(\"?\")[1] : \"\";\n                    if (queryString !== \"\") {\n                        params_arr = queryString.split(\"&\");\n                        for (var i = params_arr.length - 1; i >= 0; i -= 1) {\n                            param = params_arr[i].split(\"=\")[0];\n                            if (param === key) {\n                                params_arr.splice(i, 1);\n                            }\n                        }\n                        if (params_arr.length) rtn = rtn + \"?\" + params_arr.join(\"&\");\n                    }\n                    return rtn;\n                }\n\t\t\t\t\n\t\t\t\t\n\t\t\t\tbackBtn.addEventListener(\"click\",function(e){\n\t\t\t\t\tlet activeQuestion  = document.querySelector(\".question.active\");\n\t\t\t\t\tvar activeQuestionNo = Number(activeQuestion.getAttribute('data-question'));\n\t\t\t\t\tactiveQuestionNo = activeQuestionNo - 1;\n\t\t\t\t\tlet x = \"[data-question='\" + activeQuestionNo + \"']\";\n\t\t\t\t\tlet activeQuestionNoPrev = document.querySelector(x);\n\t\t\t\t\tif(activeQuestionNo>0){\n\t\t\t\t\t\tactiveQuestion.classList.remove(\"active\");\n\t\t\t\t\t\tactiveQuestionNoPrev.classList.add(\"active\");\n\t\t\t\t\t}\n\t\t\t\t\t\n\t\t\t\t\tif(activeQuestionNo==3){\n\t\t\t\t\t\tprogressBar.style.width = \"50%\";\n\t\t\t\t\t}\n\t\t\t\t\tif(activeQuestionNo==2){\n\t\t\t\t\t\tprogressBar.style.width = \"25%\";\n\t\t\t\t\t}\n\t\t\t\t\tif(activeQuestionNo==1){\n\t\t\t\t\t\tprogressBar.style.width = \"0%\";\n\t\t\t\t\t}\n\t\t\t\t\t\n\t\t\t\t});\n            <\/script>","protected":false},"excerpt":{"rendered":"","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"_seopress_robots_primary_cat":"","_seopress_titles_title":"","_seopress_titles_desc":"","_seopress_robots_index":"","_kad_blocks_custom_css":"","_kad_blocks_head_custom_js":"","_kad_blocks_body_custom_js":"","_kad_blocks_footer_custom_js":"","_kadence_starter_templates_imported_post":false,"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"footnotes":""},"class_list":["post-3578","page","type-page","status-publish","hentry"],"acf":[],"taxonomy_info":[],"featured_image_src_large":false,"author_info":{"display_name":"Gisela J\u00e4gebratt","author_link":"https:\/\/xn--smnexperten-rfb.se\/sv\/author\/gisela\/"},"comment_info":0,"_links":{"self":[{"href":"https:\/\/xn--smnexperten-rfb.se\/sv\/wp-json\/wp\/v2\/pages\/3578","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/xn--smnexperten-rfb.se\/sv\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/xn--smnexperten-rfb.se\/sv\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/xn--smnexperten-rfb.se\/sv\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/xn--smnexperten-rfb.se\/sv\/wp-json\/wp\/v2\/comments?post=3578"}],"version-history":[{"count":0,"href":"https:\/\/xn--smnexperten-rfb.se\/sv\/wp-json\/wp\/v2\/pages\/3578\/revisions"}],"wp:attachment":[{"href":"https:\/\/xn--smnexperten-rfb.se\/sv\/wp-json\/wp\/v2\/media?parent=3578"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}