{"id":1727,"date":"2025-05-28T19:15:03","date_gmt":"2025-05-28T19:15:03","guid":{"rendered":"https:\/\/lecochonsavant.com\/?page_id=1727"},"modified":"2025-11-20T12:39:03","modified_gmt":"2025-11-20T17:39:03","slug":"quizz-queer-drag","status":"publish","type":"page","link":"https:\/\/lecochonsavant.com\/en\/quizz-queer-drag\/","title":{"rendered":"Quizz Queer Drag"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1727\" class=\"elementor elementor-1727\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6bd1d834 e-flex e-con-boxed e-con e-parent\" data-id=\"6bd1d834\" 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-70c2471 elementor-widget elementor-widget-image\" data-id=\"70c2471\" 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=\"576\" height=\"1024\" src=\"https:\/\/lecochonsavant.com\/wp-content\/uploads\/2025\/05\/quizzs-queer-drag-art-promo-576x1024.jpg\" class=\"attachment-large size-large wp-image-1709\" alt=\"\" srcset=\"https:\/\/lecochonsavant.com\/wp-content\/uploads\/2025\/05\/quizzs-queer-drag-art-promo-576x1024.jpg 576w, https:\/\/lecochonsavant.com\/wp-content\/uploads\/2025\/05\/quizzs-queer-drag-art-promo-169x300.jpg 169w, https:\/\/lecochonsavant.com\/wp-content\/uploads\/2025\/05\/quizzs-queer-drag-art-promo-768x1365.jpg 768w, https:\/\/lecochonsavant.com\/wp-content\/uploads\/2025\/05\/quizzs-queer-drag-art-promo-864x1536.jpg 864w, https:\/\/lecochonsavant.com\/wp-content\/uploads\/2025\/05\/quizzs-queer-drag-art-promo.jpg 1024w\" sizes=\"(max-width: 576px) 100vw, 576px\" \/>\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\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ed4af16 e-flex e-con-boxed e-con e-parent\" data-id=\"ed4af16\" 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-d8d7113 elementor-widget elementor-widget-html\" data-id=\"d8d7113\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div id=\"quizz-queer-wrapper\">\r\n\r\n<style>\r\n  #quizz-queer-wrapper {\r\n    max-width: 600px;\r\n    margin: auto;\r\n  }\r\n\r\n  .quiz-container,\r\n  .start-screen {\r\n    background: #000000;\r\n    padding: 20px;\r\n    border-radius: 14px;\r\n    box-shadow: 0 0 25px rgba(255, 0, 255, 0.25),\r\n                0 0 45px rgba(0, 255, 255, 0.25);\r\n    color: #fff;\r\n    font-family: 'Poppins', sans-serif;\r\n  }\r\n\r\n  .quiz-container h1,\r\n  .start-screen h1 {\r\n    text-align: center;\r\n    font-size: 1.7em;\r\n    color: #ff4fd8;\r\n    text-shadow: 0 0 10px #ff4fd8;\r\n  }\r\n\r\n  .question {\r\n    font-size: 1.25em;\r\n    margin-bottom: 12px;\r\n    color: #4feeff;\r\n    text-shadow: 0 0 6px #4feeff;\r\n  }\r\n\r\n  .options {\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: 12px;\r\n  }\r\n\r\n  .option {\r\n    padding: 14px;\r\n    font-size: 1.05em;\r\n    border-radius: 10px;\r\n    background: #1b1b1b;\r\n    color: #ffffff;\r\n    border: 2px solid rgba(255,255,255,0.15);\r\n    cursor: pointer;\r\n    transition: 0.25s;\r\n  }\r\n\r\n  .option:hover {\r\n    background: #ff4fd8;\r\n    box-shadow: 0 0 12px #ff4fd8;\r\n  }\r\n\r\n  .option.correct {\r\n    background: #00ffa6;\r\n    color: #000;\r\n    border-color: #00ffa6;\r\n    box-shadow: 0 0 18px #00ffa6,\r\n                0 0 35px #00ffa6;\r\n    animation: glowPulse 0.7s ease-out;\r\n  }\r\n\r\n  @keyframes glowPulse {\r\n    50% { transform: scale(1.07); }\r\n  }\r\n\r\n  .option.wrong {\r\n    background: #ff003c;\r\n    border-color: #ff003c;\r\n    box-shadow: 0 0 18px #ff003c;\r\n    animation: shake 0.5s;\r\n  }\r\n\r\n  @keyframes shake {\r\n    25% { transform: translateX(-6px); }\r\n    50% { transform: translateX(6px); }\r\n    75% { transform: translateX(-4px); }\r\n  }\r\n\r\n  .timer, .score {\r\n    text-align: center;\r\n    margin-top: 12px;\r\n    color: #ff4fd8;\r\n  }\r\n\r\n  .status {\r\n    text-align: center;\r\n    margin-top: 10px;\r\n    font-style: italic;\r\n    color: #4feeff;\r\n    text-shadow: 0 0 6px #4feeff;\r\n  }\r\n\r\n  .start-screen button,\r\n  .end-screen button {\r\n    margin-top: 20px;\r\n    padding: 12px 20px;\r\n    background: #ff4fd8;\r\n    color: #000;\r\n    font-size: 1.1em;\r\n    border: none;\r\n    border-radius: 8px;\r\n    cursor: pointer;\r\n    transition: 0.25s;\r\n    box-shadow: 0 0 14px #ff4fd8;\r\n  }\r\n\r\n  .start-screen button:hover,\r\n  .end-screen button:hover {\r\n    background: #4feeff;\r\n    box-shadow: 0 0 16px #4feeff;\r\n  }\r\n\r\n  .end-screen {\r\n    text-align: center;\r\n    color: #ff4fd8;\r\n    font-size: 1.2em;\r\n    margin-top: 20px;\r\n    text-shadow: 0 0 10px #ff4fd8;\r\n  }\r\n<\/style>\r\n\r\n\r\n<div class=\"start-screen\" id=\"start-screen\">\r\n  <h1>Quizzs Queer \u2013 Drag Art<\/h1>\r\n  <p>R\u00e9pondez \u00e0 5 questions en moins de 60 secondes.<br>\r\n  Mais 3 erreurs cons\u00e9cutives et c\u2019est fini !<\/p>\r\n  <button id=\"startBtn\">\ud83c\udfac D\u00e9marrer<\/button>\r\n<\/div>\r\n\r\n<div class=\"quiz-container\" id=\"quiz-container\" style=\"display:none;\">\r\n  <div class=\"question\" id=\"question\"><\/div>\r\n  <div class=\"options\" id=\"options\"><\/div>\r\n  <div class=\"status\" id=\"status\"><\/div>\r\n\r\n  <div class=\"timer\">\u23f1 Temps restant : <span id=\"time\">60<\/span>s<\/div>\r\n  <div class=\"score\">\u2705 Bonnes r\u00e9ponses : <span id=\"correctCount\">0<\/span>\/5<\/div>\r\n\r\n  <div class=\"end-screen\" id=\"end\" style=\"display:none;\"><\/div>\r\n<\/div>\r\n\r\n<\/div>\r\n<script>\r\ndocument.addEventListener(\"DOMContentLoaded\", function () {\r\n\r\nfunction playSound(url) {\r\n  const audio = new Audio(url);\r\n  audio.play().catch(()=>{});\r\n}\r\n\r\nconst questions = [\r\n  \/* \ud83d\udc49\ud83d\udc49\ud83d\udc49 COLLE ICI TOUTES TES QUESTIONS EXACTES\r\n     (je les ai d\u00e9j\u00e0 toutes, tu peux les laisser telles quelles)\r\n  *\/\r\n  {\r\n    q: \"Quelle drag queen a d\u00e9fil\u00e9 en robe de mari\u00e9e transparente dans la saison 7 de RuPaul\u2019s Drag Race ?\",\r\n    options: [\"Violet Chachki\", \"Pearl\", \"Katya\", \"Kennedy Davenport\"],\r\n    answer: 0\r\n  },\r\n  \/* ... RESTE DE TA LISTE ... *\/\r\n];\r\n\r\nlet currentIndex = 0;\r\nlet correct = 0;\r\nlet wrong = 0;\r\nlet timeLeft = 60;\r\nlet timer;\r\nlet selected = [];\r\n\r\nconst startBtn = document.getElementById(\"startBtn\");\r\nconst startScreen = document.getElementById(\"start-screen\");\r\nconst quiz = document.getElementById(\"quiz-container\");\r\nconst questionEl = document.getElementById(\"question\");\r\nconst optionsEl = document.getElementById(\"options\");\r\nconst statusEl = document.getElementById(\"status\");\r\nconst timeEl = document.getElementById(\"time\");\r\nconst correctEl = document.getElementById(\"correctCount\");\r\nconst endEl = document.getElementById(\"end\");\r\n\r\n\r\nstartBtn.addEventListener(\"click\", startGame);\r\n\r\nfunction startGame() {\r\n  selected = questions.sort(() => Math.random() - 0.5).slice(0, 10);\r\n  startScreen.style.display = \"none\";\r\n  quiz.style.display = \"block\";\r\n\r\n  timer = setInterval(() => {\r\n    timeLeft--;\r\n    timeEl.textContent = timeLeft;\r\n    if (timeLeft <= 0) finish(\"\u23f3 Temps \u00e9coul\u00e9 !\");\r\n  }, 1000);\r\n\r\n  showQuestion();\r\n}\r\n\r\nfunction showQuestion() {\r\n  const q = selected[currentIndex];\r\n  questionEl.textContent = q.q;\r\n  statusEl.textContent = \"\";\r\n  optionsEl.innerHTML = \"\";\r\n\r\n  q.options.forEach((opt, i) => {\r\n    const div = document.createElement(\"div\");\r\n    div.className = \"option\";\r\n    div.textContent = opt;\r\n    div.addEventListener(\"click\", () => handleAnswer(i, q.answer, div));\r\n    optionsEl.appendChild(div);\r\n  });\r\n}\r\n\r\nfunction handleAnswer(i, correctIndex, element) {\r\n  document.querySelectorAll(\".option\").forEach(o => o.style.pointerEvents = \"none\");\r\n\r\n  if (i === correctIndex) {\r\n    element.classList.add(\"correct\");\r\n    playSound(\"https:\/\/lecochonsavant.com\/wp-content\/uploads\/2025\/05\/bonne-reponse.mp3\");\r\n    correct++;\r\n    wrong = 0;\r\n    correctEl.textContent = correct;\r\n\r\n    if (correct >= 5) {\r\n      playSound(\"https:\/\/lecochonsavant.com\/wp-content\/uploads\/2025\/05\/11L-winning-1748471575848.mp3\");\r\n      finish(\"\ud83c\udf89 Tu gagnes en \" + (60 - timeLeft) + \" sec !\");\r\n      return;\r\n    }\r\n\r\n  } else {\r\n    element.classList.add(\"wrong\");\r\n    playSound(\"https:\/\/lecochonsavant.com\/wp-content\/uploads\/2025\/05\/mauvaise-reponse.mp3\");\r\n    wrong++;\r\n\r\n    if (wrong >= 3) {\r\n      playSound(\"https:\/\/lecochonsavant.com\/wp-content\/uploads\/2025\/05\/rate.mp3\");\r\n      finish(\"\ud83d\udeab 3 erreurs cons\u00e9cutives !\");\r\n      return;\r\n    }\r\n  }\r\n\r\n  setTimeout(() => {\r\n    currentIndex++;\r\n    if (currentIndex >= selected.length) finish(\"Fin du quiz !\");\r\n    else showQuestion();\r\n  }, 900);\r\n}\r\n\r\nfunction finish(msg) {\r\n  clearInterval(timer);\r\n  questionEl.style.display = \"none\";\r\n  optionsEl.style.display = \"none\";\r\n  statusEl.style.display = \"none\";\r\n  endEl.style.display = \"block\";\r\n  endEl.innerHTML = msg + '<br><button onclick=\"location.reload()\">\u21bb Rejouer<\/button>';\r\n}\r\n\r\n});\r\n<\/script>\r\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\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Quizzs Queer \u2013 Drag Art R\u00e9pondez \u00e0 5 questions en moins de 60 secondes. Mais 3 erreurs cons\u00e9cutives et c\u2019est fini ! \ud83c\udfac D\u00e9marrer \u23f1 Temps restant : 60s \u2705 Bonnes r\u00e9ponses : 0\/5<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"nf_dc_page":"","_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"footnotes":""},"class_list":["post-1727","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/lecochonsavant.com\/en\/wp-json\/wp\/v2\/pages\/1727","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/lecochonsavant.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/lecochonsavant.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/lecochonsavant.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/lecochonsavant.com\/en\/wp-json\/wp\/v2\/comments?post=1727"}],"version-history":[{"count":20,"href":"https:\/\/lecochonsavant.com\/en\/wp-json\/wp\/v2\/pages\/1727\/revisions"}],"predecessor-version":[{"id":26896,"href":"https:\/\/lecochonsavant.com\/en\/wp-json\/wp\/v2\/pages\/1727\/revisions\/26896"}],"wp:attachment":[{"href":"https:\/\/lecochonsavant.com\/en\/wp-json\/wp\/v2\/media?parent=1727"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}