Take the 2-minute tour ×

I'm attempting to move a division of the website with jQuery depending on the width of the user's window. I've managed to accomplish this aspect, however the division I'm moving contains some Facebook code, and when jQuery moves it, it becomes duplicated and appears twice (resulting in two iFrames).

I have this line in my the HTML head.

<script type="text/javascript" src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_US"></script>

Then this is the line(s) that duplicates when I move the div (I have replaced my IDs with Xs):

<script type="text/javascript">FB.init("XXXXXXXXX");</script>
<fb:fan profile_id="XXXXXXXXXX" stream="0" connections="4" logobar="0" width="240" height="130" css="http://www.indiecity.com/account/css/facebook-like.css?6"></fb:fan>

I'm using remove() and append() to move the division because it needs to appear in different containers (divs). I have tried putting the FB.init in the head of the html too, but that didn't work. nothing showed up.

Any ideas?


share|improve this question
add comment

1 Answer

up vote 0 down vote accepted

What appeared to be happening in this case was that when the code was copied to a new part of the page the init() function was called again. Which then meant that two connections where in process.

Therefore the fan box double populated itself.

share|improve this answer
add comment

Your Answer


