mirror of
https://github.com/rn10950/RetroZilla.git
synced 2024-11-10 18:00:15 +01:00
58 lines
1.5 KiB
HTML
58 lines
1.5 KiB
HTML
|
<BODY>
|
||
|
|
<STYLE>
|
||
|
|
DIV { border: 2px solid khaki; }
|
||
|
|
DIV.left { border: 2px solid green; float: left; width: 100px; }
|
||
|
|
DIV.left2 { border: 5px solid blue; float: left; width: 200px; }
|
||
|
|
</STYLE>
|
||
|
|
<SCRIPT>
|
||
|
|
function getIndex()
|
||
|
|
{
|
||
|
|
var it = document.getElementById("getid");
|
||
|
|
var index = it.value;
|
||
|
|
if (index == "") index = 0;
|
||
|
|
return index;
|
||
|
|
}
|
||
|
|
function makeFloater(clazz)
|
||
|
|
{
|
||
|
|
var div = document.createElement("DIV");
|
||
|
|
var text = document.createTextNode("Block Text");
|
||
|
|
div.appendChild(text);
|
||
|
|
div.setAttribute("CLASS", clazz);
|
||
|
|
return div;
|
||
|
|
}
|
||
|
|
function appendFloater()
|
||
|
|
{
|
||
|
|
var f = makeFloater("left");
|
||
|
|
var it = document.getElementById("it");
|
||
|
|
it.appendChild(f);
|
||
|
|
}
|
||
|
|
function insertFloater()
|
||
|
|
{
|
||
|
|
var f = makeFloater("left2");
|
||
|
|
var it = document.getElementById("it");
|
||
|
|
var kids = it.childNodes;
|
||
|
|
var index = getIndex();
|
||
|
|
if ((index < 0) || (index > kids.length)) index = 0;
|
||
|
|
var before = kids[index];
|
||
|
|
it.insertBefore(f, before);
|
||
|
|
}
|
||
|
|
function removeFloater()
|
||
|
|
{
|
||
|
|
var f = makeFloater("left2");
|
||
|
|
var it = document.getElementById("it");
|
||
|
|
var kids = it.childNodes;
|
||
|
|
var index = getIndex();
|
||
|
|
if ((index < 0) || (index > kids.length)) index = 0;
|
||
|
|
it.removeChild(kids[index]);
|
||
|
|
}
|
||
|
|
</SCRIPT>
|
||
|
|
<FORM>
|
||
|
|
<INPUT TYPE=button ONCLICK="appendFloater();" value="Append Floater">
|
||
|
|
<INPUT TYPE=button ONCLICK="insertFloater();" value="Insert Floater">
|
||
|
|
<INPUT TYPE=button ONCLICK="removeFloater();" value="Remove Floater">
|
||
|
|
<INPUT TYPE=text value="" ID="getid">
|
||
|
|
</FORM>
|
||
|
|
<HR>
|
||
|
|
<DIV ID=it></DIV>
|
||
|
|
</BODY>
|