Detect click over an iframe

Asked

Viewed 313 times

0

I have an iframe:

<div class="recebe_iframe">
    <iframe class="caixa_iframe" src="https://www.youtube.com/embed/dfsdfsdf" frameborder="0" allowfullscreen></iframe>
</div>

Wanted to with jquery detect when a user clicks on this youtube iframe or even on that div recebe_iframe. It can be when the user clicks inside it, anywhere, it can be in play, pause, volume, never mind... just detect that click.

jquery iframe

2 answers

1

You can use:

$( "recebe_iframe" ).click(function() {
  //código
});

As it is not very clear what you are wanting, this may get you some north.

Example: 

$( "p" ).click(function() {
  $( this ).slideUp();
});
p {
    color: red;
    margin: 5px;
    cursor: pointer;
  }
  p:hover {
    background: yellow;
  }
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>click demo</title>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
 
<p>First Paragraph</p>
<p>Second Paragraph</p>
<p>Yet one more Paragraph</p>

 
</body>
</html>

Reference: jQuery API Documentation

  • Hi, thanks for the reply, but that’s not quite it. I have the iframe from Youtube. Wanted to detect when the user clicks inside it, anywhere, can be in play, pause, volume, never mind... just detect that click.

1

The click does not to capture, what to do is to check when there was a "Hover" in the div that the frame is involved.

$(document).ready( function() {
    var frame = -1;
    $('iframe').hover( function() {
        alert('hover')
    }, function() {
        frame = -1
    });
        $(window).blur( function() {
        if( frame != -1 ) 
            alert('desapareceu'); 
    });
});
  
    
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
></script>
<div class='banner'>
    <iframe src='http://somedomain.com/whatever.html'></iframe>
<div>

Browser other questions tagged jquery iframe

You are not signed in. Login or sign up in order to post.