Evanescence
Evanescence

Reputation: 749

close icon doesn't appear

I was trying to add a text popup box on my page, and this code helped me but I need to add a close icon (which is an image in my code)..

but it doesn't work :/

here is my code:

function show_hide_box(an, width, height, borderStyle) {

if (navigator.userAgent.indexOf("MSIE") != -1) {
    var browserIsIE = true;
} else { browserIsIE = false; }


var href = an.href;
var boxdiv = document.getElementById(href);

if (boxdiv != null) {
if (boxdiv.style.display=='none') {
  move_box(an, boxdiv);
  boxdiv.style.display='block';
} else
  boxdiv.style.display='none';
return false;
}

boxdiv = document.createElement('div');
boxdiv.setAttribute('id', href);
boxdiv.style.display = 'block';
boxdiv.style.position = 'absolute';
boxdiv.style.width = width + 'px';
boxdiv.style.height = height + 'px';
boxdiv.style.border = borderStyle;
boxdiv.style.backgroundColor = '#FFF';

var inClosebox = document.createElement("div");
inClosebox.setAttribute('id', 'Close');
inClosebox.style.position = 'absolute';

if (browserIsIE) {
  inClosebox.style.left = '-1px';
  inClosebox.style.top = '0px';
} else {
  inClosebox.style.left = '-15px';
  inClosebox.style.top = '-15px';
}

inClosebox.style.visibility = 'hidden';

var inImage2 = document.createElement("img");
inImage2.onclick = function () { this.document.close(); };
inImage2.setAttribute('src', '../../Images/closebox.png');
inImage2.setAttribute('width', '30');
inImage2.setAttribute('height', '30');
inImage2.setAttribute('border', '0');
inImage2.style.cursor = 'pointer';
inClosebox.appendChild(inImage2);


var contents = document.createElement('iframe');
contents.scrolling = 'yes';
contents.frameBorder = '0';
contents.style.width = width + 'px';
contents.style.height = height + 'px';
contents.src = href;

boxdiv.appendChild(contents);
boxdiv.appendChild(inClosebox);
document.body.appendChild(boxdiv);
move_box(an, boxdiv);

return false;
}

can any help me please?

Upvotes: 0

Views: 227

Answers (1)

codeandcloud
codeandcloud

Reputation: 55248

That should mean that the path of src is wrong. ie, ../../Images/closebox.png

Add this to your code and see whether this works

inImage2.setAttribute('alt', 'Close');

Even if this doesn't work, it shows you that something else is wrong with the code.

Its a very good practice to add alt attribute to img tag always.

Update:

I just saw this inClosebox.style.visibility = 'hidden'; You are appending img to that and so how are you gonna possibly make it visible when the parent is hidden?
Beats me. Or do you have extra code? If no, please remove that line and try.

Upvotes: 1

Related Questions