How to display a gif of preload while loading comments facebook?

Question

I have a javascript code customized so that when scroll down the page to where is the facebook comment box not loaded. At the time the scroll reaches the site comments are loaded and appear.

But it takes about two seconds and I would like to appear while charging a lively until comments are fully charged gif. I tried to add but does not disappear when displaying the comments. Probably because javascript really do not know when they have been fully charged comments.

Is there any way to fix it?

function loadAPI() {
    var js = document.createElement('script');
    js.src = '//connect.facebook.net/en_US/sdk.js#xfbml=1&appId=73773988950&version=v2.0';
    document.body.appendChild(js);

}

window.onscroll = function () {

    if (document.getElementById("coments")) {


    var rect = document.getElementById('coments').getBoundingClientRect();

    if (rect.top < window.innerHeight) {

        loadAPI();

        window.onscroll = null;
    }

    }

Actually if dynamic content itself place a gif you know that javascript knows what he is charging and shows once loaded, removing the gif.

score 1 · Answer 1 · answered Mar 06 '16 at 12:52

1

Have the following tag:

  <body onload=" myFunction()">

With a javascript function myFunction() to display an image only.

answered Mar 06 '16 at 12:52

Arif Burhan

507
4
12

But I mean the area where load facebook comments, not the entire page – PlayerWet Mar 06 '16 at 12:56
Have the **onload()** attribute in that
.
– Arif Burhan Mar 06 '16 at 13:01
Sorry, you could extend the example? Where would you use it? Thank you. – PlayerWet Mar 06 '16 at 13:03

score 1 · Accepted Answer · answered Mar 06 '16 at 13:05

1

Put the loading gif in a <div> where you later want your facebook comments to appear and load the facebook comments into that div instead of appending them to the <body>.

answered Mar 06 '16 at 13:05

Johannes

64,305
18
73
130

But the problem is that the content of comments facebook when they start to load disappears gif. And I need to disappear once fully charged. I do not know if you understand me. – PlayerWet Mar 06 '16 at 13:13
@PlayerWet, you accepted this answer - is this how you solved the issue? I'm facing a similar thing. – Amir Eldor May 19 '16 at 11:39

score 1 · Answer 3 · edited May 23 '17 at 11:50

1

Just had a quick look , and apparently you can't use onload with div, however there is a full discussion here:

Onload-in-div-whynot

edited May 23 '17 at 11:50

Community

1
1

answered Mar 06 '16 at 13:10

Arif Burhan

507
4
12

How to display a gif of preload while loading comments facebook?

3 Answers3