Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Using JQuery to delay loading of div, code not working in Chrome (window.onload)

I'm using the code below to delay the loading of a div until the entire web page is loaded. It works perfectly in Firefox and Safari (because they each have lines in the code to make sure it works specifically for each, I haven't tested IE yet), but not in Chrome (which should, I think, work with window.onload).

Could somebody please help me out with this?

<script type="text/javascript">

function insertFB(){
    var html='<div class="fb-page" data-href="https://www.facebook.com/bobcaputolivingwell" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true" data-show-posts="true"><div class="fb-xfbml-parse-ignore"><blockquote cite="https://www.facebook.com/bobcaputolivingwell"><a href="https://www.facebook.com/bobcaputolivingwell">Bob Caputo Living Well</a></blockquote></div></div>';
    $("#FB_PAGE").html(html);
}

if (document.addEventListener){
    document.addEventListener("DOMContentLoaded", insertFB, false);
}

if (/WebKit/i.test(navigator.userAgent)){
    var _timer = setinterval(function(){
        if(/loaded|complete/.test(document.readyState)){
            insertFB();
        }
    },10);
}

window.onload = insertFB();
</script>
like image 369
Jared Caputo Avatar asked Jan 25 '26 13:01

Jared Caputo


1 Answers

Well, firstly I'll answer specifically your question:

It's not working in Google Chrome, because you're using setinterval, and Javascript is a case-sensitive language. The correct name of the method is setInterval.


Besides that, your code is full of errors, you check for a method inside document, and don't use else if to check the others, so you always check all, and probably call the method you want two or more times.

The other thing is that you're using setInterval but you're never clearing the interval, so that thing is gonna run every 10ms forever.

And finally, the last thing, you're calling the insertFB function when you're trying to attach it to the onload event. You shouldn't be using parenthesis for that.


Take a look at Can I use addEventListener? and at Can I use DOMContentLoaded?, and you'll see that it's supported by all major browsers, even some old ones, and you should only use another way, if you really need to support IE8 (nowadays it's unlikely).

like image 107
Buzinas Avatar answered Jan 27 '26 01:01

Buzinas



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!