title: Problems with jQuery (datepicker) integration and images path
body: <p>I would like to integrate jQuery-DatePicker in my web application.</p>
  
  <p>I downloaded the scrips, the css and the images and put them in the corresponding directories: scripts, css and images.</p>
  
  <p>I then defined them in scripts.xhtml:</p>
  
  <pre><code>&lt;ui:composition
  xmlns="http://www.w3.org/1999/xhtml"
  xmlns:h="http://java.sun.com/jsf/html"
  xmlns:ui="http://java.sun.com/jsf/facelets"&gt;
  
  &lt;h:outputScript library="scripts" name="jquery-1.3.2.min.js"/&gt;
  &lt;h:outputScript library="scripts" name="jquery-ui-1.7.1.custom.min.js"/&gt;
  &lt;h:outputScript library="scripts" name="daterangepicker.jQuery.js"/&gt;&lt;/ui:composition&gt;
  </code></pre>
  
  <p>and styles.xhtml;</p>
  
  <pre><code>&lt;ui:composition
  xmlns="http://www.w3.org/1999/xhtml"
  xmlns:h="http://java.sun.com/jsf/html"
  xmlns:ui="http://java.sun.com/jsf/facelets"&gt;
  
  &lt;h:outputStylesheet library="css" name="commons.css"/&gt;
  &lt;h:outputStylesheet library="css" name="styles.css"/&gt;
  &lt;h:outputStylesheet library="css" name="doi.css"/&gt;
  &lt;h:outputStylesheet library="css" name="ui.daterangepicker.css"/&gt;
  &lt;h:outputStylesheet library="css" name="redmond/jquery-ui-1.7.1.custom.css"/&gt;   
  
  &lt;!-- PRINT STYLES --&gt;
  &lt;!-- Note: there is currently no way to determine the "media" attribute with h:outputStylesheet --&gt;
  &lt;link rel="stylesheet" media="print" href="${facesContext.externalContext.requestContextPath}/javax.faces.resource/css/print.css.xhtml" type="text/css" /&gt;&lt;/ui:composition&gt;
  </code></pre>
  
  <p>The problem is that all the related images are not loaded/found.</p>
  
  <p>For ex. the background is hardcoded in the css -> background-image: url("images/ui-icons_d8e7f3_256x240.png") which is not the corresponding path...</p>
  
  <p>Do I have to specify something else somewhere? I can't imagine I have to manually change all the paths in the scripts and css...</p>