CODEWITHSUNDEEP
javascriptjqueryhtml
Danny
Danny

Reputation: 7518

Making images work in popup created through javascript

I have a popup window that all of the data is added through javascript. However all of the images that get added don't get resolved. How can I make the images work without providing an absolute url?

JSFiddle

$("#openPopup").click(function() {
    var win = window.open();
    var body = $(win.document.body);

    $(body).append($("<img src='/img/logo.png' style='background:blue' />"));
    $(body).append($("<div>Hello World</div>"));
});

Upvotes: 1

Views: 72

Answers (2)

bmx
bmx

Reputation: 53

window.location.hostname should do it.

$(body).append($("<img src='http://"+window.location.hostname+"/img/logo.png' style='background:blue' />"));

http://jsfiddle.net/babumxx/v2zKa/2/

http://fiddle.jshell.net/babumxx/v2zKa/2/show/

Upvotes: 1

Diodeus - James MacFarlane
Diodeus - James MacFarlane

Reputation: 114367

UI elements are best used as CSS backgrounds:

#openPopup {
     background-image:url(img/logo.png);
     background-repeat:no-repeat;
     background-position:10px 10px;
}

CSS paths are relative to the location of the stylesheet, not the page itself.

Upvotes: 0

Related Questions