{"id":106,"date":"2025-12-12T09:59:38","date_gmt":"2025-12-12T08:59:38","guid":{"rendered":"https:\/\/nerdsea.nl\/hoofdpagina\/?page_id=106"},"modified":"2026-04-08T21:46:45","modified_gmt":"2026-04-08T19:46:45","slug":"kaarten","status":"publish","type":"page","link":"https:\/\/nerdsea.nl\/hoofdpagina\/kaarten\/","title":{"rendered":"Kaarten"},"content":{"rendered":"\n<figure class=\"wp-block-image alignwide size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2500\" height=\"713\" src=\"https:\/\/nerdsea.nl\/wp-content\/uploads\/2025\/10\/linobanner-scaled-e1775677470275.jpg\" alt=\"\" class=\"wp-image-85\" srcset=\"https:\/\/nerdsea.nl\/wp-content\/uploads\/2025\/10\/linobanner-scaled-e1775677470275.jpg 2500w, https:\/\/nerdsea.nl\/wp-content\/uploads\/2025\/10\/linobanner-scaled-e1775677470275-300x86.jpg 300w, https:\/\/nerdsea.nl\/wp-content\/uploads\/2025\/10\/linobanner-scaled-e1775677470275-1024x292.jpg 1024w, https:\/\/nerdsea.nl\/wp-content\/uploads\/2025\/10\/linobanner-scaled-e1775677470275-768x219.jpg 768w, https:\/\/nerdsea.nl\/wp-content\/uploads\/2025\/10\/linobanner-scaled-e1775677470275-1536x438.jpg 1536w, https:\/\/nerdsea.nl\/wp-content\/uploads\/2025\/10\/linobanner-scaled-e1775677470275-2048x584.jpg 2048w\" sizes=\"auto, (max-width: 2500px) 100vw, 2500px\" \/><\/figure>\n\n\n\n<div class=\"wp-block-group alignwide is-layout-flow wp-block-group-is-layout-flow\">\n<style>\n  \/* Center the dropdown above the video container *\/\n  .video-selector {\n      margin-left: 0px;\n      margin-right: 0px;\n      margin-top: 10px;\n      margin-bottom: 10px;\n      text-align: left;\n  }\n\n  \/* Style the dropdown *\/\n  select {\n    font-size: clamp(14px, 2vw, 18px);\n    width: 100%;\n    padding: 8px 0px;\n    border: none;\n    border-radius: 0px;\n    border: 1px solid black;\n    background-color: white;\n    color: black;\n    cursor: pointer;\n    transition: all 0.2s ease;\n  }\n\n  select:focus,\n  select:focus-visible {   \n    border: 1px solid black;\n    background-color: white;\n    outline: none; \/* this removes the extra thick outline when it is selected*\/\n  }\n\n  select:hover {\n    border: 1px solid black;\n    background-color: #eee;\n  }\n\n  \/* Video container styling *\/\n  .video-container {\n    width: 100%;\n    max-width: 100%;\n    margin: 5px auto;\n    text-align: center;\n    border-radius: 0px;\n  }\n\n  video {\n    width: 100%;\n    border-radius: 0px;\n    outline: none;\n  }\n<\/style>\n\n<div class=\"video-selector\">\n  <label for=\"video-select\"><\/label>\n  <select id=\"video-select\">\n    <option value=\"combined_wind_waves_and_swell.mp4\" selected>Windgolven en swell<\/option>\n    <option value=\"total_swell.mp4\">Swell<\/option>\n    <option value=\"wind_waves.mp4\">Windgolven<\/option>\n    <option value=\"combined_storm_surge_and_tide.mp4\">Getij<\/option>\n    <option value=\"combined_wind-driven_and_tidal_currents.mp4\">Stroming<\/option>\n    <option value=\"surface_winds.mp4\">Wind<\/option>\n  <\/select>\n<\/div>\n\n<div class=\"video-container\" id=\"video-container\">\n  <video controls>\n    <source src=\"https:\/\/nerdsea.nl\/videos\/combined_wind_waves_and_swell_height.mp4\" type=\"video\/mp4\">\n    Your browser does not support the video tag.\n  <\/video>\n<\/div>\n\n<script>\ndocument.addEventListener('DOMContentLoaded', () => {\n    const BASE_VIDEO_URL = \"https:\/\/nerdsea.nl\/videos\/\";\n\n    const select = document.getElementById(\"video-select\");\n    const video = document.querySelector(\"#video-container video\");\n    const source = video.querySelector(\"source\");\n\n    \/\/ Load default selected video on first page load (NO autoplay)\n    source.src = BASE_VIDEO_URL + select.value;\n    video.load();\n\n    \/\/ Change video when dropdown changes (NO autoplay)\n    select.addEventListener(\"change\", () => {\n      source.src = BASE_VIDEO_URL + select.value;\n      video.load();\n    });\n  });\n\n\n<\/script>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Windgolven en swellSwellWindgolvenGetijStromingWind Your browser does not support the video tag.<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-no-title","meta":{"footnotes":""},"class_list":["post-106","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/nerdsea.nl\/hoofdpagina\/wp-json\/wp\/v2\/pages\/106","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nerdsea.nl\/hoofdpagina\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/nerdsea.nl\/hoofdpagina\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/nerdsea.nl\/hoofdpagina\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nerdsea.nl\/hoofdpagina\/wp-json\/wp\/v2\/comments?post=106"}],"version-history":[{"count":78,"href":"https:\/\/nerdsea.nl\/hoofdpagina\/wp-json\/wp\/v2\/pages\/106\/revisions"}],"predecessor-version":[{"id":569,"href":"https:\/\/nerdsea.nl\/hoofdpagina\/wp-json\/wp\/v2\/pages\/106\/revisions\/569"}],"wp:attachment":[{"href":"https:\/\/nerdsea.nl\/hoofdpagina\/wp-json\/wp\/v2\/media?parent=106"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}