created element won't show up in Safari browser

L

liberty

Hi,
I have looked everywhere to try and solve my problem-- looked at W3C
DOM Compatibility charts, read articles, tried debuggers, and still my
script is not working.
The problem I have is this. I am working on a script that dynamically
generates maps with research sites that show up when selected from a
pulldown list. The sites show up in every browser except for Safari,
and I can't figure out why. I have made a simple function that
illustrates what I want to do, and this still doesn't work in Safari.
I call it in my html file by using a button. Pressing the button
should cause a colored box to show up on top of the map layer. Here
is the script:

<snip>
function drawABox(color) {
var parent=document.getElementById("groupsBox");
var sitebox = document.createElement("div");
var imagefill = document.createElement("img");
imagefill.setAttribute("src", "/images/site.png");
sitebox.appendChild(imagefill);
sitebox.setAttribute("id", "abox");
sitebox.setAttribute("class", "site");
sitebox.style.visibility = "visible";
sitebox.style.position = "absolute";
sitebox.style.left = "100px";
sitebox.style.top = "100px";
sitebox.style.right = "100px";
sitebox.style.bottom = "100px";
sitebox.style.width = "40px";
sitebox.style.height = "40px";
sitebox.style.borderStyle = "solid";
sitebox.style.borderWidth = "thick";
sitebox.style.color = color;
parent.appendChild(sitebox);
showOrHideBox('abox', 'true', color);
}

// Display (if bool is true) or make invisible (if bool is false) the
element
// indicated by id (e.g. <div id="id">). If displaying the element,
this
// function sets the border-color style to color.
function showOrHideBox (id, bool, color) {
var box = document.getElementById(id);
if (color) {
box.style.borderColor = color;
}
if (bool) {
box.style.visibility = 'visible';
} else {
box.style.visibility = 'hidden';
}
}

.................
Then the HTML is like this:
<input type="button" value="red box!" onClick="drawABox('red');">

</snip>

If anyone could tell me if this is fixable, or whether it's a bug in
Safari, or anything to help, I would greatly appreciate it.
Thanks in advance!
Liberty
 
L

liberty

I guess I spoke too soon. It turns out that Safari doesn't like
putting things in hidden <div>s. So I set the attributes of each to
visible, and it worked.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,776
Messages
2,569,603
Members
45,190
Latest member
ClayE7480

Latest Threads

Top