PDA

View Full Version : Getting contents of a div and put it in a different div?

mrruben5
06-16-2005, 11:21 PM
My question is in the source (spacer text, lol).

#content {
position: relative;
background:#ccc;
}
#content #contenttext {
color: #fff;
position: absolute;
top:0px; left:0px;
z-index: 50;
}
#content #contentshadow {
color: #666;
position: absolute;
top: 1px; left: 1px;
z-index: 49;
}My (x)html structure is like this:<div id="content">
<div id="contentshadow">
<div id="contenttext">There is some text here that is white and is
on a very light background. It needs some shadow, nobody can
read this. So I am looking for a function takes the content of a
particular ID, and appends it to another id. This way I can
create easy drop-shadows without the hassle to do it with CSS.
</div>
</div>
</div>
mrruben5
06-17-2005, 01:13 AM
Allright, I found something but it's not working because of something. What do I have to change?<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>

<head>

<title>shadow</title>

<script type="text/javascript">
function fromto(x,y) {
if (document.getElementById)
{
from = document.getElementById(x);
to = document.getElementById(y);
}
else if (document.all)
{
from = document.all[x];
to = document.all[y];
}
to.innerHTML = ''; //prevent bug in IE 5.01 on mac
to.innerHTML = from.innerHTML
}</script>

<style type="text/css">
body {
background:#ccc;
color:#fff;
}
</style>
</head>

<body onload="fromto(div1,div2);">

<div id="div1">
There is some text here that is white and is
on a very light background. It needs some shadow, nobody can
read this. So I am looking for a function takes the content of a
particular ID, and appends it to another id. This way I can
create easy drop-shadows without the hassle to do it with CSS.
</div>
<div id="div1">&nbsp;</div>
</body>

</html>
Kor
06-17-2005, 01:15 PM
Use DOM methods cloneNode() and appendChild()


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript">
onload=function(){
var d1 = document.getElementById('div1').cloneNode(true);
document.getElementById('div2').appendChild(d1);
}
</script>
</head>
<body>
<div id="div1">There is some text here that is white and is
on a very light background. It needs some shadow, nobody can
read this. So I am looking for a function takes the content of a
particular ID, and appends it to another id. This way I can
create easy drop-shadows without the hassle to do it with CSS.
</div>
<br>
<br>
<div id="div2"></div>
</body>
</html>