WebResources Embedded Resources and Javascript how to use them within another embedded resource?

Question

I asked a similar question before but the response was pretty weak, so not sure if I worded it correctly.

I currently have a custom server control on an asp.net page. However the control uses entirely embedded JavaScript and Image resources. My assembly has all of the web resources correctly set-up and I have been using the images etc as icons sucessfully.

However now, if possible I would like to use the embedded webresource images directly in the javascript file. I have tried the following with no luck so far:

document.getElementById('button').src = 'WebResource("NAMESPACE.FOLDER.IMAGE.png")';
document.getElementById('button').src = '<%WebResource("NAMESPACE.FOLDER.IMAGE.png")%>';

I am not sure what else to try as most of my googling seems to meet a dead end.

Thanks in advance.

Answer 1

I believe you are looking for the WebResourceAttribute.PerformSubstitution Property:

WebResourceAttribute.PerformSubstitution on MSDN

We use it in the AssemblyInfo.cs file in the project where embedded resources are defined:

[assembly: System.Web.UI.WebResource("", "text/css", PerformSubstitution = true)]

Edited:

AssemblyInfo.cs

[assembly: System.Web.UI.WebResource("Project.Content.Styles.css", "text/css", PerformSubstitution = true)]
[assembly: System.Web.UI.WebResource("Project.Images.Sprite.png", "image/png")]

Content/Styles.css (embedded resource)

.icon {
    background-image: url(<%=WebResource("Project.Images.Sprite.png")%>);
}