Afficher un iframe selon un select

Bonsoir à tous,

Voilà mon but :
afficher un Iframe selon un select.

Avec le code ci-dessous cela fonctionne parfaitement du moment que l'on exerce un choix dans le select.

Par contre, cela ne fonctionne pas en arrivant sur la page.
Le form affiche bien "euros" par défaut mais par contre les deux iframes sont visibles !!
Normal puique le javascript n'a pas été sollicité.

Tout devient normal lorsque, justement, on fait une selection dans le form et ,là, le javascript entre en action.

Auriez-vous une idée lumineuse pour que seul l' Iframe "euros" s'affiche ?

Je vous remercie par avance pour votre aide.
Pascal

le code :
<div id="tarif">
<Form>
<select name="type" id="type" onchange="changementType();">
<option value="Euros">Euros</option>
<option value="GBP">GBP</option>
</select>
</Form>

<script language="javascript">
function changementType() {
var type = document.getElementById("type").value;
if (type == "Euros") {
document.getElementById("Euros").style.display="block";
} else{
document.getElementById("Euros").style.display="none";
}
if (type == "GBP"){
document.getElementById("GBP").style.display="block";
}else{
document.getElementById("GBP").style.display="none";
}
}
</script>

<iframe id="Euros" src="https://sheet.zoho.com/publishrange.do?id=f836c5afc53f51a6f1b3cd9558401d38" style="height: 300px; width: 900px;" marginwidth="0" marginheight="0" padding="auto" frameborder="0" scrolling="no"> </iframe>

<iframe id="GBP" src="https://sheet.zoho.com/publishrange.do?id=e2db64ef2215f65b6aa5776caf03cd66" style="height: 300px; width: 900px;" marginwidth="0" marginheight="0" padding="auto" frameborder="0" scrolling="no"> </iframe>
</div>

Bonjour,

Il faut appeler ta fonction changementType() une fois le DOM chargé.

Merci pour votre réponse rs459 mais n'ayant aucune expérience en javascript, je ne vois pas où placer votre correction sachant qu'il y a un "function changementType()" .

D'ailleurs DOM ça veut dire quoi ?