Bonjour,
j'ai une petit problème avec un iFrame youtube.
J'utilise une image ("cursor.png") que je recalibre sur mon curseur afin qu'il le suive grâce à :
		
<script type="text/javascript">
        //<!--
                document.onmousemove = suitsouris;
                function suitsouris(evenement)
                {
                        if(navigator.appName=="Microsoft Internet Explorer")
                        {
                                var x = event.x+document.body.scrollLeft;
                                var y = event.y+document.body.scrollTop;
                        }
                        else
                        {
                                var x =  evenement.pageX;
                                var y =  evenement.pageY;
                        }
                        document.getElementById("cursor").style.left = (x-4)+'px';
                        document.getElementById("cursor").style.top  = (y-7)+'px';
                }
        </script>


Mais quand je passe sur mon iFrame youtube mon curseur perso reste bloqué à la limite de l'Iframe et ne suit plus du tout mon curseur.

Après un peu de recherche sur le net, j'ai vue que une fois sur l'iframe. L’événement onmousemove n'est plus capturé.
Depuis je bloque et je suis totalement perdu.

Voilà mon script :

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
	
    <title>CONNECTING TO SERVER</title>				    
<style type="text/css">
body { color: #ffffff; background: #000000; }
</style>

<!-- CSS Style for the background slider -->
<link rel="stylesheet" href="css/style.css">
		<script type="text/javascript">
        //<!--
                document.onmousemove = suitsouris;
                function suitsouris(evenement)
                {
                        if(navigator.appName=="Microsoft Internet Explorer")
                        {
                                var x = event.x+document.body.scrollLeft;
                                var y = event.y+document.body.scrollTop;
                        }
                        else
                        {
                                var x =  evenement.pageX;
                                var y =  evenement.pageY;
                        }
                        document.getElementById("cursor").style.left = (x-4)+'px';
                        document.getElementById("cursor").style.top  = (y-7)+'px';
                }
        </script>	
</head>
<body>
<header>
<!-- END INFOBOX -->

<!-- Loader (for some reason this refuses to use CSS) -->
<div id="loading"><p style="position: absolute; right: 20px; bottom: -5px; border:1px; border-style:solid; border-color:#000000; background: #000000; padding: 0.5em; width: 260px; opacity: 0.85;"><font face="verdana" size="4">Chargement serveur</font><font color="#000000">#</font><img src="img/loading.gif" style="width:20px;height:20px;"></p></div>
<!-- END LOADER -->

<!-- Logo (for some reason this refuses to use CSS) -->
<div id="logo"><p style="position: absolute; left: -0px; bottom: -15px;"><img src="img/logo.png"></p></div>
<!-- END LOGO -->

<!-- Infobox slider -->
<!-- END INFOBOX SLIDER -->			
			
<!-- Background Slider -->
  <script src="js/jquery-1.11.0.min.js"></script>
  <script src="js/jquery.backstretch.min.js"></script>
  <script src="js/owl.carousel.min.js"></script>
  <script src="js/jquery.ajaxchimp.js"></script>
  <script src="js/lj-safety-first.js"></script>
  <script src="js/music-ctrl.js"></script>
<!-- END BACKGROUND SLIDER -->

<img src="img/cursor.png" id="cursor" style="position:absolute;width: 35px;"/>

<div id="player">
<iframe id="youtube" onmouseover="iFrameStopMove;"
src="https://www.youtube.com/embed?listType=playlist&list=PLjqWQYQy_xSbjBwRJz6pR2kWthUMvCn2I&controls=0&disablekb=1&modestbranding=0&autoplay=1&rel=0&showinfo=0&start=1"
</iframe>
</div>

  <!-- Loadscreen time out -->
    <script>
        var timer = setTimeout(function() {
            window.location='timeout.html' <!-- redirection path -->
        }, 141000); <!-- Time out in milliseconds before redirect -->
    </script>
<!-- END LOADSCREEN TIME OUT -->
  </body>
</html>
Salut

Une iframe c'est une ouverture vers un site distant. Ton javascript ne peut pas être actif dans le site distant. il est actif sur TON site.
Modifié par JENCAL (18 Jul 2019 - 13:07)
Yep, pour des raisons de sécurité et de protection contre le phishing, si tu souhaites récupérer des évènements sur l'iframe dans ta page, il te faut la participation du propriétaire du site appelé par l'iframe. (divulgachage: avec youtube, cela n'arrivera pas)