Salve a tutti, ho elaborato il seguente codice per far sì che quando si clicchi su un pulsante di registrazione nella pagina, lo sfondo diventi più scuro, e compaia al centro un iframe.

Il mio codice attuale fa sì che l'iframe risulti un rettangolo completamente bianco, e sinceramente non riesco a capacitarmi del perché.

Potreste dirmi dove eventualmente sbaglio?

Ho ridotto all'osso il codice, per rendere la cosa più rapida e semplice...

codice:
<!DOCTYPE html>
<html lang="it">
<head>
<meta charset="utf-8">

<script type="text/javascript">function blablabla() { 
document.getElementById("tizio").style.display="block";
document.getElementById("caio").style.display="inline";
}</script>

</head>
<body>

<img src="img/signup.jpg" onclick="blablabla()">

<iframe id="tizio" style="width: 600px; height: 500px; position: absolute; top: 50%; left: 50%; background-color: #FFFFFF; display: none; z-index: 100" scrolling="no" marginwidth="0" marginheight="0" frameborder="0" src="http://google.it"></iframe>

</div>

<div id="caio" style="display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: black; -moz-opacity: 0.75; opacity:.75; filter: alpha(opacity=75); z-index: 50"></div>

</body>
</html>