In a new window with a blank URL, how can you provide a path from which to find relative resources?

I see the imgs are given relative URLs to work with (as they should be). I am not 100% positive what the base URL is for window.open. I don’t know if it’s about:blank, but since the absolute URLs work and the relative ones don’t, I think it’s a safe bet that the browser doesn’t know where to point to.

So add a element to explicitly tell it where to point. Here is the documentation:

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base

I assume that you are writing elements to the window with js, so in that case you will want to create the base element, append it to the head and set base.href to the base url you are using.

I think you might save yourself some trouble on things like this by NOT using window.open (which got a really bad rap in the bad days of popups) and use a hidden modal div that you can load (or write) html into, then unhide. However, you might have a completely valid reason for using the popup.

Leave a Comment