How to run a Javascript function on an iframe before the source (src) is loaded?

Question

I've asked this question before this one, trying to figure out why I was seeing scrollbars on the a-ads iframes, on this website, while some swear they didn't see them! Hence, I have discovered that the appearance of the iFrame scrollbars is by execution order. And with faster or slower computers, results may vary.

I realize that I have to replace scrolling="no", a strong (but unsupported in HTML5), attribute that forces no scrollbars on iframes, with a JavaScript, or CSS alternative. However, the CSS overflow:hidden; is too weak to override whatever style the iframe's source may contain (e.g. overflow:scroll, overflow:auto, etc.). So the solution must be with JavaScript.

The caveat however, is that the javascript must activate after the iframe itself is loaded, but before the source (src="") is loaded. Because if scrolling="no" is replaced after the source is loaded it has no effect on the outcome of the iframe display. Though, if it is place before the <iframe> tag markup is reached, how does the JavaScript know what to modify? It is as good as not present at that point.

One More Problem: The source can't be stripped from the <iframe> tag, and replaced in JavaScript. We've tried that, and while it worked....sort of... we lost ad impressions and clicks into a black hole, because the spider (i.e. bot) at a-ads couldn't, or had problems with, detecting the proper a-ads code on the webpage. But if we left it in the iframe and just reloaded the source after scrolling="no" was set, then that would result in double ad-loads (i.e. invalid impressions).

This is a real pickle!

All the Einsteins of the world - You're Needed!

Also, this S.O. question doesn't apply.

Screenshots

Chrome Proof

IE Proof

Opera Proof

Firefox was best-behaved

Do you have the ability to add css/js inside the iframe? Is the iframe src coming from the same domain? — Jackson
– Jackson, Commented Sep 22, 2015 at 20:46
Hi, @Jackson , No the source is coming from an off-site ad server at a-ads.com. Thanks for asking! :-) — James Anderson Jr.
– James Anderson Jr., Commented Sep 22, 2015 at 20:48
Is this iframe created by script? If not why can't the html source be modified? If it is script created would need interval timer to detect it's existence — charlietfl
– charlietfl, Commented Sep 22, 2015 at 21:01
Hi @charlietfl, Any script, or markup on our domain can be manipulated, or modified, except only by the conditions outlined above. However the page/markup/script of the src of the iframes (i.e. the child frames), is beyond our control to modify. Thanks for asking ;-) — James Anderson Jr.
– James Anderson Jr., Commented Sep 22, 2015 at 21:17

James Anderson Jr. · Accepted Answer · 2015-09-23 16:25:15Z

1

This issue has now been solved, for now, I think. Here is the solution:

<head>

    <script type="text/javascript">

    function noScrollBarsOnAAdUnit( ElementID )
    {   

        document.getElementById( ElementID ).setAttribute("scrolling", "no");       
        return true;

    };

    </script>

</head>

<body>

    <script type="text/javascript">noScrollBarsOnAAdUnit( 'aa-unit-top-center' );</script>
    <iframe id='aa-unit-top-center' style='width:468px;height:60px;' class='a-ads-frame' data-aa='[ad-id]' src='https://ad.a-ads.com/[ad-id]?size=468x60'>
        <!-- iframe fallback message here -->
    </iframe>
    <script type="text/javascript">noScrollBarsOnAAdUnit( 'aa-unit-top-center' );</script>

</body>

Fellow S.O. members, please, check this page, to assure this fix is consistent, and really works at least 99.99%, if not 100%, of the time.

Thanks!

-James A.

edited Sep 23, 2015 at 16:25

answered Sep 23, 2015 at 13:21

James Anderson Jr.

8261 gold badge11 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to run a Javascript function on an iframe before the source (src) is loaded?

Screenshots

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

Screenshots

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related