DOM version of insertAdjacentHTML??

[Nedals]

This, IE6 specific, property will create a <DIV> but it will not work for NS7.

document.body.insertAdjacentHTML('BeforeEnd','<div id="name"></div>');

Is there a more DOM compliant property or, at least a property that works in NS7 (not document.write, please!)

[gil davis]

The process for creating a similar HTML objects using the W3C DOM model is:var newObj = document.createElement("div");
newObj.id = "name"; // really bad choice - reserved word
var myBody = document.getElementsByTagName("body")[0];
myBody.appendChild(newObj);Note that IE 6 will support this syntax as well.

[Nedals]

Gil,
That's great. :)
I guess you already know where I'm using this..
http://forums.webdeveloper.com/showthread.php?s=&threadid=5843

Give me a couple of hours (days) and I'll let you know how it turns out (and update the animation for all to see).

For those out there looking to get into DHTML, I thought this animation was an interesting example. Anybody want to code it for NS4? ;)

[gil davis]

While you're at it, syou should work on eliminating the eval() statements and the document.all arrays. That will make it easier to bring it into line with NS 6/7 and Mozilla.

Take a look at http://gil.davis.home.att.net/wipe.htm for my attempt at transitions.

[Nedals]

Gil;
Thank's for the compatability report. I incorporated your code and its worked in IE5 and NS7 as advertised. All eval's and document.all's are gone (not posted to the web yet). I'm now having trouble with the positioning but, based on the link you gave me, there is probably enough code for me to pull out everything I need to get the animation working in NS7. I'll pass on NS4 for now.
Have any comments on how to get this working in Opera (I have 6.01)? I've heard (or read) that it doesn't do well with DHTML

Again, thank's a lot and I'll bother you again when I get in trouble. :D

[Nedals]

Gil, my head hurts! :confused:
This is supposed to create the slice elements in the document body and insert the picture. It works in IE, but in NS7 it's tiling
the elements (at the end of the page) with the picture, each overlapping a squashed frame containing '<>'. What am I doing wrong?
for (i=0; i<=slices; i++) {
// Create all the slice 'span' elements
var newObj = document.createElement('<span style="position:absolute"></span>');
newObj.id = "ss"+i;
var theDoc = document.getElementsByTagName("body")[0]; // What's the [0]??
theDoc.appendChild(newObj);
// Position the slice elements and insert the image
var slice = document.getElementById("ss"+i);
slice.style.top = 300;
slice.style.left = 500;
slice.style.border = borderWidth+ 'px solid ' +borderColor;
slice.innerHTML = '<img src="' +picture[pictNo]+' ">';
}

There's lots of other problems (position and clipping don't work) but I'm hoping to solve these myself, maybe!;

[gil davis]

for (i=0; i<=slices; i++) {
// Create all the slice 'span' elements
var newObj = document.createElement('span');
newObj.id = "ss"+i;
var theDoc = document.getElementsByTagName("body")[0]; // What's the [0]??
/* getElementsByTagName returns an array. I want the first one, even though I know there is only one. */
theDoc.appendChild(newObj);
// Position the slice elements and insert the image
newObj.style.position = "absolute";
newObj.style.top = 300;
newObj.style.left = 500;
newObj.style.borderWidth = borderWidth + "px";
newObj.style.borderStyle = "solid";
newObj.style.borderColor = borderColor;
newObj.innerHTML = '<img src="' + picture[pictNo] + ' ">';
/* although this works, innerHTML is not yet a W3C recommendation. You should create the element "img", change the src property and the n append the child to "newObj" */
}