Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Jquery capture Click on Iframe

Tags:

jquery

iframe

So I have an Iframe on my page like

<iframe width="640" height="360" frameborder="0" allowfullscreen="" src="http://www.youtube.com/xxxxxx">

I was wondering how I could capture the click event on this. The Iframe's do not have an id or class set on them

like image 213
StevieB Avatar asked Jan 13 '23 21:01

StevieB


1 Answers

I ran into a situation where I had to track clicks on a social media button pulled in through an iframe. A new window would be opened when the button was clicked. Here was my solution:

var iframeClick = function () {
    var isOverIframe = false,
    windowLostBlur = function () {
        if (isOverIframe === true) {
            // DO STUFF
            isOverIframe = false;
        }
    };
    jQuery(window).focus();
    jQuery('#iframe').mouseenter(function(){
        isOverIframe = true;
        console.log(isOverIframe);
    });
    jQuery('#iframe').mouseleave(function(){
        isOverIframe = false;
        console.log(isOverIframe);
    });
    jQuery(window).blur(function () {
        windowLostBlur();
    });
};
iframeClick();
like image 140
pizzarob Avatar answered Jan 19 '23 11:01

pizzarob