diese blöden divs -.-

[Neander94]

Hallö Leute,

ich bin ziemlich neu mit der ganzen Materie, so Javascript und HTML und so, deshalb hab ich ziemliche Schwierigkeiten beim gestalten einer Website.
Das Problem welches sich auftut, ist folgendes:
ich versuche ein vorgefertigtes div beim aufrufen der Seite hinter einer Bildschirm füllenden Grafik verschwinden zu lassen, um es dann mithilfe eines Links wieder sichtbar zu machen. Dieses div soll verschiebbar sein und 3 Links enthalten (das div selbst soll ein Hintergrundbild erhalten, auf welchem 3 Knöpfe abgebildet sind. es ist außerdem wesentlich kleiner als die Ursprungsgrafik).
Der eine Link auf dem kleinen div soll dafür zuständig sein dieses wieder zu schließen, wenn man es nicht mehr braucht.
Grundsätzlich habe ich bereits gegoogelt und die ergebnisse ausprobiert (auch von selfhtml) aber bisher habe ich keinen Erfolg gehabt.
Hier nochmal die Eugenschaften, die das neue div haben soll:
-verschiebbar
-versteckbar
-bedienbar (Links)

Folgende Fehler treten bei mir auf:
-das div öffnet sich links unter dem Ursprungsdiv
-das div zeigt die hintergrundgrafik nicht an
-es ist nicht verschiebbar

Hier nun einige Teile des Codes den ich verwende:

-Für die erstellung des divs:
<div id="dragable" onmousedown="dragstart(this)style="display:none; position:fixed;top:0px;left:0px;height:500px;width:200px; border-style:none" / border="0"">//ich habe auch schon als position absolute und relative probiert

Für die Verschiebbarkeit:

<script type="text/javascript">  
                var dragobjekt=null;  
  
                        var dragx = 0;  
                        var dragy = 0;  
  
                        var posx = 0;  
                        var posy = 0;  
  
                        function draginit() {  
                        document.onmousemove = drag;  
                        document.onmouseup = dragstop;  
                }  
  
                         function dragstart(element) {  
  
                        dragobjekt = element;  
                        dragx = posx - dragobjekt.offsetLeft;  
                        dragy = posy - dragobjekt.offsetTop;  
                }  
  
                        function dragstop() {  
  
                        dragobjekt=null;  
                }  
  
                        function drag(ereignis) {  
  
                        posx = document.all ? window.event.clientX : ereignis.pageX;  
                        posy = document.all ? window.event.clientY : ereignis.pageY;  
                        if(dragobjekt != null) {  
                        dragobjekt.style.left = (posx - dragx) + "px";  
                        dragobjekt.style.top = (posy - dragy) + "px";  
                }  
                }

Dieser Teil stammt aus SelfHTML.org

Für das Verstecken und Hervorholen:

function hervor(dragable){  
                if(document.getElementById(dragable){  
                Wenn es sichtbar war, unsichtbar machen und umgedreht.*/  
                document.getElementById(dragable).style.display =  
                (document.getElementById(dragable).style.display == 'none') ? 'inline' : 'none';  
 }  
}

Der Link zum aktivieren der Sichtbarkeitsfunktion:
<area shape="rect" coords="646,270,717,304" href="javascript:hervor">

Ein weiters Problem ist, das ich den Aufwand so gering wie möglich halten möchte, da ich 10 Seiten brauche, auf denen man nachher 30 solcher divs öffnen können soll (natürlich alle mit unterschiedlichen Bilder dahinter ;).

Danke schonmal im vorraus :)