I'm trying to use the Google to load jQuery for some pages and jQuery UI for others. On the pages where I just need jQuery, I do the following:
<script src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
function OnLoad() {
// my jQuery goodness
}
google.load("jquery", "1");
google.setOnLoadCallback(OnLoad);
</script>
And on the pages where I need jQueryUI, I also add this:
<link rel="stylesheet" type="text/css" href="/Library/jQuery/UI/Smoothness/css/smoothness/jquery-ui-1.7.2.custom.css">
<script type="text/javascript">
function OnLoadUI(){
$('div.tabs').tabs();
$('input.date').datepicker();
}
google.load("jqueryui", "1");
google.setOnLoadCallback(OnLoadUI);
</script>
Q: Am I doing anything wrong? It's working, but I want to know if I'm writing code that doesn't make sense. Q: Does Google have the various UI css themes? Or am I right in thinking that I need to serve up the smoothness theme myself? (It's not really a custom theme - it's just the default one).
Looks fine to me. I'm just going to assume that Google does things properly so that jQuery UI could never possibly load before jQuery, which is what the Developer's Guide seems to suggest.
Google does not host the themes, no. You'll need to get them from the jQuery UI website and host them yourself.
EDIT: I take it back. See this blog post for the Google CDN links for the post popular themes. I never knew that!
So, to answer your question: you are doing everything right - except for this secret, undocumented list of CSS files. Okay - keep up the good work!
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With