title: How to use jQuery UI icons without buttons?
body: <p>jQuery UI comes with some good icons.
  How can I use them without buttons? Let's say how to create link with <em>plus</em> sign and to react on hover and click by changing icons?
  <a href="http://jsfiddle.net/and7ey/gZQzt/">Here</a> is the demo just with icon added.</p>
  
  <p><strong>Upd 1:</strong>
  On hover icon should change the color from grey to black (please see it <a href="http://jquery-ui.googlecode.com/svn/trunk/tests/static/icons.html">here</a>). In my demo it is black from the beginning. </p>
  
  <p><strong>Upd 2:</strong>
  Here is almost what I need - <a href="http://jsfiddle.net/and7ey/gZQzt/6/">http://jsfiddle.net/and7ey/gZQzt/6/</a> - but without that background rectangle, I need just plus sign.</p>
  
  <p><strong>Upd 3:</strong>
  Looks like it would be better not to use standard jQuery UI styles, but to refer directly to the <a href="http://jquery-ui.googlecode.com/svn/trunk/themes/base/images/">images</a>, but I don't know how use it.</p>
  
  <p>Seems I need to define CSS like:</p>
  
  <pre><code>width: 16px; 
  height: 16px; 
  background-image: url(images/ui-icons_222222_256x240.png);
  background-position: -32px -128px;
  </code></pre>
  
  <p>Positions can be easily found at <a href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/smoothness/jquery.ui.theme.css">jquery.ui.theme.css</a> file.
  But how should I:</p>
  
  <ol>
  <li>define correct background-image url?</li>
  <li>modify CSS to react on click, hover?</li>
  </ol>