✔ relative Box

[reuabreliz]

Also deine Erklärung hat mir jetzt schon Mal weitergeholfen. Aber irgendwas stimmt noch nicht ganz. Hier ist mein bisheriger Code:

function showArticle(myArticle)
{
	var myDiv = document.deleteForum.createElement("div");
	var myBeitrag = document.deleteForum.createTextNode(myArticle);
	myDiv.setAttribute("id='box'");
	myDiv.appendChild(myBeitrag);
	document.deleteForum.appendChild(myDiv);
}

<form name='deleteForum' action='' method='POST'>
<ul>
 <li>Beitrag
 <li><span id='beitrag' onmouseover='showArticle(".$articles[$a]["name"].")'>".$articles[$a]["name"]."</span></li>
 </li>
</ul>
</form>

Muss ich eigentlich die <ul> auch in den Elementbaum einbeziehen? Das heißt so schreiben: document.deleteForum.ul.li

 

[Sven Mintel]

setAttribute() hat 2 Parameter...den Namen des Attributes und den Wert des Attributes.
Es müsste also so lauten:

myDiv.setAttribute('id','box');

Zu der anderen Frage... es kommt ganz drauf an, wo du die Box einbnden willst.
appendChild() fügt sie am Ende des Referenzknotenz ein...in dem Fall also am Ende des Formulars, hinter der <ul>

 

[reuabreliz]

So ich habe mein Problem nun erfolgreich gelöst. Wer will kann sich den Code selber zu eigen machen.

Das ganze erzeugt einen span "kurzerText". Beim überfahren von "kurzerText" mit der Maus wird rechts daneben "langerText" in einer Box angezeigt. Das kann man verwenden, wenn man ein Wort erklären will. Dabei ist das Wort "kurzerText" und die Erklärung "langerText"

-->Das ist die css-datei für die relative Box

box { font-size: 10px; position:relative; top:0px; right:0px; background-color:#fffff0; border-width: thin; border-style: solid;}

-->Das sind die Funktionen die die Box anzeigen und wieder verstecken

var myBox;
var myAcronymId;

function showBox(Content,id)
{
	myBox = document.createElement("box");
	var myContent = document.createTextNode(Content);
	myBox.appendChild(myContent);
	myAcronymId = document.getElementById(id);
	myAcronymId.appendChild(myBox);
}

function hideBox()
{
	myAcronymId.removeChild(myBox);
}

-->Das ist der Html-Code der zum setzen der Funktionen notwendig ist. Hier kann natürlich auch PHP eingesetzt werden.

<span  id="id" onmouseover='showArticle("langerText","id")' onmouseout='hideArticle()'>kurzerText</span>