tags:

views:

55

answers:

3
+1  Q: 

jquery google link

Has anyone got any idea how this google code works?

i got the following:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;
<html xmlns="http://www.w3.org/1999/xhtml"&gt;
  <head>
    <title>My Google AJAX Search API Application</title>
    <script src="http://www.google.com/jsapi?key=blahblahblah" type="text/javascript"></script>
    <script language="Javascript" type="text/javascript">
  google.load("jquery", "1");
   google.load("jqueryui", "1");
    </script>
  </head>
  <body>
   <div class="ui-state-highlight">
    hello world
   </div>
  </body>
</html>

However the <div></div> should display the error box with hello world. but it doesn't show the red background therefor the ui is not working ...

What have i done wrong here?

+5  A: 

You also need the stylesheet if you want styling, like this:

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css"&gt;

This is the base (grey) theme, there are others (be sure too update the version number!)

Unless you need google.load for other things, you can include the scripts directly, it's worth looking at this question for the advantages/disadvantages to using google.load().

Loading them directly would look like this:

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css"&gt;
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"&gt;&lt;/script&gt;
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"&gt;&lt;/script&gt;
Nick Craver  2010-05-23 14:27:55
thanx that makes a hell of alot of sense :) unlike googles page... could you help me find the location for the ui? of jquery as there was only the jquery core there ... Also can i not put latest? instead of the version number or something like that i have seen it done before :)
Val  2010-05-23 14:40:07
@Val -Google has a page here: http://code.google.com/apis/ajaxlibs/ for the latest, you can just put `/1/` instead of `/1.4.2/` for the latest version 1, or `/1.4/` for the latest 1.4.x release, make sense?
Nick Craver  2010-05-23 14:44:01
it's not necessarily good to use the latest updated one, some of your things may break. I personally like using just 1.8.1 then I'll update when and if necessary.
Derek  2010-05-23 15:29:03
@Derek - You can use `1.8`, then you'll get only bugfix releases...in any case, they leave it wide open to the developer to make the decision about upgrades, which is nice.
Nick Craver  2010-05-23 15:39:27
A: 

hello world should be displayed, but because the class ui-state-hightlight is nowhere to be found, hello world just appears as plain text.

Khnle  2010-05-23 14:29:36
A: 

It works using <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css"&gt;

You may also roll your own style here

http://jqueryui.com/themeroller/
 2010-05-23 14:55:45

related questions

A problem with the jquery dialog when using the themeroller css
Java: Flash a window to grab user's attention
Restrict selection of SELECT option without disabling the field
What documentation and training are you pushing out with your app?
Business Application UI Design
How do I implement a chromeless window with WPF?
How to create a graphical user interface mock-up for research?
Are there any guidelines for designing user interface for mobile devices?
Diagramming Software for a Developer/Designer
Best AJAX Framework
Fighting programmer colors.
How to program user preferences
Overcoming Programmers' UI
Where can I find a graphical command shell?
Which PHP Framework will get me to a usable UI the fastest?
Is there a way to check to see if the user is currently idle?
Should menu items always be enabled? And how do you tell the user?
How do you test the usability of your user interfaces
What's the best way to code a desktop application-like menu bar in Javascript?
Future proofing a large UI Application - MFC with 2008 Feature pack, or C# and Winforms?
Instrumenting a UI
User Interface Design
What do you use to Unit-Test your Web UI?
User Interfaces - Colors and Layout
How far should one take e-mail address validation?