Automatisch meeschalen van de zoekmodule binnen uw pagina

Waarom?

Om een betere bezoekerservaring te creëren van de zoekmodule binnen uw pagina, is het vanaf nu mogelijk om de iFrame automatisch mee te laten schalen.
Deze wordt geschaald op basis van de hoogte en breedte van de pagina waar deze wordt ingeladen – met als doel een native ervaring te simuleren.

Hoe te implementeren

Onderstaand vindt u een stappenplan van hoe u deze functionaliteit werkend kunt krijgen binnen uw pagina. Bovendien kunt u hier de voorbeeldimplementatie downloaden.

1. Download en importeer het JS-bestand iframeResizer.min.js in uw pagina.

 <script src='./iframeResizer.min.js'> </script>

 2. Laad het iFrame element in binnen uw pagina en geef deze een ID-attribuut genaamd ‘iframe-daz’:

<iframe id="iframe-daz" src="https://embed.dagattractieszeeland.nl/"></iframe>

 3. Na het inladen van het iFrame element, kunt u de volgende JS-functie gebruiken om deze te initialiseren:

<script>
iFrameResize({ log: false }, "#iframe-daz")
</script>

4. Om iOS support te bieden, is het belangrijk om het iFrame element een min-width van 100% te geven.

<style>
#iframe-daz {
min-width: 100%;
}
</style>