Cloning the node seems to work too. Thanks.
rounded_edges = function() {
var rounded_divs = getElementsByTagAndClassName( "DIV", "rounded");
for( var i in rounded_divs ) {
var rounded_div = rounded_divs[i];
var rounded_div_clone = rounded_div.cloneNode( true );
rounded_div_clone.className = "edge_tl";
rounded_div.style.padding = 0;
rounded_div.style.border = "none";
replaceChildNodes( rounded_div, DIV( {"class":"edge_tr"}, DIV
( {"class":"edge_br"}, DIV( {"class":"edge_bl"}, rounded_div_clone ))));
}
}
On Feb 3, 2006, at 6:42 PM, Bob Ippolito wrote:
On Feb 3, 2006, at 3:32 PM, John Wehr wrote:
I'm creating my own rounded edges function. I'm familiar with the
one built into MochiKit, but it doesn't meet my needs.
The following code works in IE and Firefox, but bombs in Safari,
it appears that Safari does not appreciate the child node swapping.
Do any of you know a way to transfer all the child nodes of node A
to node B, then append node B as a child of node A, such that it
will work cross-browser?
or
Do you see anything in the following code that's throwing off Safari?
Try something like this:
var rounded_edges = function() {
var rounded_divs = getElementsByTagAndClassName( "DIV", "rounded");
forEach(rounded_divs, function (rounded_div) {
// save children
var rounded_div_children = concat(rounded_div.childNodes);
// remove children
replaceChildNodes(rounded_div);
// add children to another DIV
var inner_div = DIV({"class":"edge_tl"}, rounded_div_children);
inner_div.style.padding = rounded_div.style.padding;
rounded_div.style.padding = 0;
rounded_div.style.border = "none";
// repopulate original div
replaceChildNodes(rounded_div,
DIV({"class":"edge_tr"},
DIV({"class":"edge_br"},
DIV({"class":"edge_bl"}, inner_div)
)
)
);
});
};
-bob
