[Jquery] problema modal box su iframe
Ciao ragazzi,
in una pagina php ho messo un iframe che richiama un sito esterno. All'interno del tag body ma fuori dall'iframe
ho messo una popup che volevo richiamare con javascript per attivare questa funzione ogni tot secondi, ma non
riesco a far funzionare la popup: ho messo un alert nella funzione e quindi so che la funzione viene eseguita,
ma la popup non appare. La cosa strana è che se tolgo l'iframe, invece, funziona. Sapete dirmi dove sbaglio?
Si può lanciare una popup su un iframe a schermo intero?
questo è il codice della pagina html
Codice HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test Layout</title>
<style type="text/css">
body, html {
margin: 0; padding: 0; height: 100%; overflow: hidden;
}
</style>
<!-- Bootstrap stile-->
<link href="template/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" type="text/css" href="template/css/bootstrap-theme.css"/>
<script src="template/js/respond.min.js"></script>
<script src="template/js/css3-mediaqueries.js"></script>
<!-- Stile custom -->
<link href="template/css/custom.css" rel="stylesheet" type="text/css">
<script src="js/jquery-1.11.0.min.js"></script>
<!-- Bootstrap js -->
<script type="text/javascript" src="template/js/bootstrap.min.js"></script>
<script type=text/javascript>
function mostraPopUp() {
alert("ciao");
$('#popUpIframe').modal('show');
setTimeout('mostraPopUp()', 3000);
}
timeout = setTimeout('mostraPopUp()', 10000);
</script>
</head>
<body onload=mostraPopUp()>
<iframe width="100%" height="100%" <?php echo"src=\"http://www.unsito.it"; ?> />
<!-- PopUp -->
<div class="modal fade" id="popUpIframe" tabindex="-1" role="dialog" aria-labelledby="popUpIframe" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content popup">
<div class="popupTop">
<img src="img/placeholder.jpg" class="img-responsive"/>
<div class="popupOverlay h3"> Lorem ipsum dolor sit amet </div>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer bibendum, ligula non euismod posuere, odio diam porta quam, id volutpat lorem neque eu ipsum. Praesent faucibus faucibus justo, dignissim placerat nulla. Donec massa diam, faucibus ut lacus ut, interdum gravida justo. Sed dapibus semper justo, at porta nibh dictum sit amet. Donec porta nibh odio, et adipiscing justo dictum consequat. Integer blandit venenatis arcu. </p>
</div>
</div>
</div>
<!-- PopUp -->
</body>
</html>
