Page Element Load Order
Hello, I have several scripts/elements on my site and I want some of them to load after others.
I have some Facebook social plugins on the site and those tend to load slowly because they have to pull info from the Facebook servers and that in turn delays the main content in the center of my site which is basically a Jquery slideshow.
So, I want certain content to load only after the rest of the page has loaded:
Facebook plugins
Live chat button
Ratepoint review box
Wibiya bar on the bottom
I want a way to load all of those things after the rest has loaded fully.
I am using other Jquery elements on the page so I already have that JS file loaded so a solution using Jquery would be fine.
I was looking into the .ready() function but I'm not sure if that's really what I'm looking for.
I was also looking at window.onload but I can't do a document.write in those and I don't know how else to put the Facebook code in there.
That code is in this format:
<fb:like-box profile_id="12328716103773
Please help, thanks!!
I have some Facebook social plugins on the site and those tend to load slowly because they have to pull info from the Facebook servers and that in turn delays the main content in the center of my site which is basically a Jquery slideshow.
So, I want certain content to load only after the rest of the page has loaded:
Facebook plugins
Live chat button
Ratepoint review box
Wibiya bar on the bottom
I want a way to load all of those things after the rest has loaded fully.
I am using other Jquery elements on the page so I already have that JS file loaded so a solution using Jquery would be fine.
I was looking into the .ready() function but I'm not sure if that's really what I'm looking for.
I was also looking at window.onload but I can't do a document.write in those and I don't know how else to put the Facebook code in there.
That code is in this format:
<fb:like-box profile_id="12328716103773
Please help, thanks!!
ASKER
How would I use that code to load the FB plugin?
well if that line has to in the body, then
$(body).append("<fb:like-b
should suffice.
Please try this and let me know
$(body).append("<fb:like-b
should suffice.
Please try this and let me know
ASKER
That doesn't seem to be working. I tried the following just to test it and it does not seem to have added it to the body.
<script type="text/javascript">
$(document).ready(function
$(body).append("Test");
});
</script>
<script type="text/javascript">
$(document).ready(function
$(body).append("Test");
});
</script>
ASKER
Here is my site by the way: http://www.lowpriceskates.com
I have the code on there now.
I have the code on there now.
can you try?
<script type="text/javascript">
$(document).ready(function
$("body").append("Test");
});
</script>
<script type="text/javascript">
$(document).ready(function
$("body").append("Test");
});
</script>
ASKER
That doesn't seem to be working.
I was looking at this page: http://api.jquery.com/append/
Is it better to try to append it to the div that it's in? That div has a class of "fblike".
I tried to do that and it didn't work, though.
I was looking at this page: http://api.jquery.com/append/
Is it better to try to append it to the div that it's in? That div has a class of "fblike".
I tried to do that and it didn't work, though.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Hmmm, weird. It seems to be working in one place on the page but not the other:
http://www.lowpriceskates.com/test-1.aspx
http://www.lowpriceskates.com/test-1.aspx
<<It seems to be working in one place on the page but not the other:>>
Please be specific. Thanks
Please be specific. Thanks
ASKER
OK, I figured out why that wasn't working. That was my fault. I had the code you gave me ABOVE where Jquery was included in the page. So that part is working now. Thanks!
One more small question, how can I use this method to include a script only if the protocol is HTTP?
Here is the code that I'm using now:
<script type="text/javascript">
<!--
if(window.location.protoco
document.write( '<\/scr'+'ipt>' );
}
//-->
</script>
Thanks!!
One more small question, how can I use this method to include a script only if the protocol is HTTP?
Here is the code that I'm using now:
<script type="text/javascript">
<!--
if(window.location.protoco
document.write( '<\/scr'+'ipt>' );
}
//-->
</script>
Thanks!!
you can check the protocol of the current url, by using location.href
http://www.w3schools.com/jsref/prop_loc_protocol.asp
http://www.w3schools.com/jsref/prop_loc_protocol.asp
//code to load the scripts
});
is exactly the place where you should be loading those scripts programmatically
see how
http://api.jquery.com/jQuery.getScript/
http://www.1stwebdesigner.com/development/quick-tip-get-more-efficient-with-jquerys-getscript/