title: Sharepoint image referencing
body: <p>I can't seem to find the correct encapsulating or prefix syntax for referencing an image located in xxxx site collection.</p>
  
  <p>Right now I have three variations of one image that will be applied to the footer.  And these variants are selected based on the site collection, so I can't directly set the image to the masterpage (Unless I want to make three masterpages, which is just overkill for a single image).</p>
  
  <p>I have tried going about this using Javascript to set the source of an img element and CSS to set the url of a container element's background-image.  Both are failing me.</p>
  
  <p>In Javascript, I have tried setting the src attribute of my element to: </p>
  
  <p><code>"&lt;SharePoint:ProjectProperty Property='SiteUrl' runat='server' /&gt;/_catalogs/masterpage/Images/myimage.gif;"</code> </p>
  
  <p><code>"&lt;% $SPUrl:~sitecollection/_catalogs/masterpage/Images/myimage.gif %&gt;";</code></p>
  
  <p><code>"~sitecollection/_catalogs/masterpage/Images/myimage.gif";</code></p>
  
  <p>and repeated the same with CSS for background-image property to a div element.  But all I ever get is errors or it doesn't translate the sharepoint code.</p>
  
  <p>Does anyone have any idea what else I can try?</p>