Hello javascript newsgroup,
Sorry for my bad english please...
Today I have write some of my first JS scripts.
My problem is to create a <spantag in the div tag with the name
"favoriten".
In the first step I create the span tag in the "hinzufügen" function
in my JS. The function is called when someone clicked a picture on my
site (onclick).
After that the span tag is create, but not exactly in my div
"favoriten"... The span tag is create on the top of my site...
Here I paste my code...
JS file (favoriten.js)
------------------------------
function hinzufügen() {
var favoritenDiv = document.getElementById("favoriten");
var auswahl = this;
var favobilder = favoritenDiv.getElementsByTagName("img");
if( favobilder.length < 3 ) {
favoritenDiv.appendChild(auswahl);
auswahl.onclick = null;
}
else {
alert("Es sind schon 3 Bilder in den Favoriten");
}
//Create a span tag
var neuSpanElement = document.createElement("span");
neuSpanElement.className = "rang";
var neuTextElement = document.createTextNode(5);
neuSpanElement.appendChild(neuTextElement);
favoritenDiv.appendChild(neuSpanElement);
}
------------------------------
html site: (index.html)
------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
..rang {
position:absolute;
text-align:center;
top:20px;
font-size:small;
background-color:#FFFFFF;
border:thin solid black;
width:20px;
z-index:99;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"
/>
<script type="text/javascript" src="favoriten.js"></script>
</head>
<body onload="autostart()">
<div id="part1">Hier eine Auswahl von Pics:</div>
<div id="bild">
<img src="images/elefant.jpg" />
<img src="images/kaffee.jpg" />
<img src="images/ajax.jpg" />
<img src="images/entwurfsmuster.jpg" />
</div>
<div id="part2">Hier deine Favorieten:</div>
<div id="favoriten">
</div>
</body>
</html>
------------------------------
