Element an Mauszeiger anheften

[terbaik]

Wie schaffe ich es, ein HTML Element an den Mauszeiger anzuheften, also dass es keine starre Position in der webseite hat, sondern dem Mauszeiger folgt ?
Die position kann man ja mit style="position:+art+;" ändern... Aber Wie geht das mit der Maus ?

Mein bisheriger Code (mit [FIXED]FIXED[/FIXED]-position):

<body oncontextmenu="get_contextmenu(); return false" onclick="unget_contextmenu()">
<script>
function get_contextmenu(){
document.getElementById('context_menu').style.display = "block";
}
function unget_contextmenu(){
document.getElementById('context_menu').style.display = "none";
}
</script>
<style>
.menu_item{color:grey; text-decoration:none; font-family:arial; font-size:10pt; width:140px; border:none; display:block; text-indent:3px; padding:4px}
.menu_item:hover{color:navy; background-color:#EcFcFF; width:140px; border:1px navy solid; display:block; padding:3px}
</style>
<table style="width:150px; border:1px lightgrey solid; display:none; position: fixed; background-color:white;" cellspacing="0" cellpadding="0" id="context_menu">
<tr>
<td>
<a href="#" onclick="self.print()" class="menu_item">Drucken</a>
</td>
</tr>
<tr>
<td>
<a href="#" onclick="self.location.reload()" class="menu_item">Aktualisieren</a>
</td>
</tr>
</table>
</body>

Wäre sehr dankbar für Hilfe... Auch für HILFREICHE Links

 

[tsseh]

http://de.selfhtml.org/javascript/sprache/eventhandler.htm#onmousemove
http://de.selfhtml.org/javascript/objekte/style.htm#style_eigenschaften
im letzten link left, top

 

[kkapsner]

Da musst du aus dem Event-Objekt die Mauskoordinaten auslesen und dann die Position neu eintragen.

PS: Hast du dir deinen Code schon mal in Opera angesehen - ich wünsche viel Spaß!
PPS: ich hab' sowas auch schon einmal gemacht: http://kkjs.kkapsner.de/tests/DOM_test.html (DOM-Inspektor öffnen)

 

[terbaik]

http://de.selfhtml.org/javascript/sprache/eventhandler.htm#onmousemove
http://de.selfhtml.org/javascript/objekte/style.htm#style_eigenschaften
im letzten link left, top

ja, das sind dann die mouseover, mouseout, ... events, aber die meine ich nicht... Ich meine ich will ein eigenes kontextmenü (als Tabelle realisiert), das sich bei oncontextmenu öffnet, das klappt, und es soll sich an der stelle öffnen, wo ich rechts mit der maus geklickt habe...

Da musst du aus dem Event-Objekt die Mauskoordinaten auslesen und dann die Position neu eintragen.

Kannst du mir mal bitte sagen wie man das macht ?

 

[kkapsner]

http://de.selfhtml.org/javascript/objekte/event.htm

Ansonsten kannst du es ev. anhand meines Beispieles nachbauen.

 

[terbaik]

Danke kkapsner, ich habs gelöst, mit deiner Hilfe...

CODE:

<body oncontextmenu="get_contextmenu(); return false" onclick="unget_contextmenu()">
<script type="text/javascript">
function Mausklick (Ereignis) {
  if (!Ereignis)
    Ereignis = window.event;
  if (document.getElementById) {
    document.getElementById("context_menu").style.left  = Ereignis.clientX + "px";
    document.getElementById("context_menu").style.top = Ereignis.clientY + "px";
  } else if (document.all) {
    document.all.context_menu.style.left = Ereignis.clientX;
    document.all.context_menu.style.top = Ereignis.clientY;
  }
}

document.onmousedown = Mausklick;
</script>
<script>
function get_contextmenu(){
document.getElementById('context_menu').style.display = "block";
}
function unget_contextmenu(){
document.getElementById('context_menu').style.display = "none";
}
</script>
<style>
.menu_item{color:grey; text-decoration:none; font-family:arial; font-size:10pt; width:198px; border:none; display:block; text-indent:0px; padding:4px; background-color:white; text-align:left;}
.menu_item:hover{color:navy; background-color:#EcFcFF; width:198px; border:1px navy solid; display:block; padding:3px}
</style>
<table style="width:200px; border:1px lightgrey solid; display:none; position: fixed; background-color:white;" cellspacing="0" cellpadding="0" id="context_menu">
<tr>
<td>
<INPUT TYPE="BUTTON" class="menu_item" VALUE="Drucken" onClick="self.print()">
</td>
</tr>
<tr>
<td>
<INPUT TYPE="BUTTON" class="menu_item" VALUE="Aktualisieren" onClick="self.location.reload()">
</td>
</tr>
<tr>
<td>
<INPUT TYPE="BUTTON" class="menu_item" VALUE="Quelltext ansehen" onClick= 'window.location = "view-source:" + window.location.href'> 
</td>
</tr>
</table>
</body>

 

[kkapsner]

Bitte - aber wie gesagt: Opera...

 

[terbaik]

Bitte - aber wie gesagt: Opera...

Tja... dieses Problem habe ich behoben... jetzt kommt das eigene Kontextmenü NUR im Firefox, im IE, Opera, usw... kommt das normale Kontextmenü...
Eine Frage hätte ich noch... wie kann man per javascript einen ausgewählten Text kopieren ?

 

[kkapsner]

Das funktioniert jetzt wirklich nur im IE, aber hast du schon einmal von Suchmaschinen gehört? http://lmgtfy.com/?q=js+clipboard

 

[terbaik]

Das funktioniert jetzt wirklich nur im IE, aber hast du schon einmal von Suchmaschinen gehört? http://lmgtfy.com/?q=js+clipboard

Schade.... Den IE finde ich nämlich wirklich be***issen.... Sorry, wenn einer hier den hat.... Mit Firefox gibts da Wirklich keine Lösung ? Das kann doch nicht sein...

 

[Junkee[]]

ist aber so.