Javascript - Kontextmenü bzw. Layer

MySql · 02.04.2008, 16:32

Hallo Ihr lieben phpfriend'iander,

Ich habe vor einer gewissen Zeit mal nach einem Script zur änderung des Kontextmenü's gefunden. Nunja.. geklappt hat es sicherlich.. nur im Opera Browser nicht.

Mitlerweile, habe ich mir überlegt das es eh schwachsinn ist das Kontextmenü zu verändern. Daher dort wichtige Elemente gespeichert sind auf die meine User warscheinlich gerne zurück greifen. (Bild speichern, Javascript - Kontextmenü bzw. Layer, etc. pp.)

Nun suche ich nach einer Möglichkeit, ein eigenes Kontextmenü oder einen Layer anzeigen zulassen sobald man auf einen Link mit der linken Maustaste klickt.

Nun wie ich im Forum Tutorials schon sagte, fange ich gerade erst mit Javascript an und backe mir schon ein Eis weil das mit dem auf und zuklappen geklappt. So stellt sich natürlich heraus, das ich das mit dem eigenen Kontextmenü für einem Klick mit der Linkenmaustaste wohl nicht schaffe. Deshalb bitte ich Euch hier um Hilfe. Villeicht weiß ja jemand wo ich sowas herbekomme oder hat sogar ein Script parat. Es würde mich sehr freuen.

Liebe Grüße,
MySQL.

nikosch · 02.04.2008, 17:12

Nimm doch lieber ein MouseOver Event um ein kleines (!) Menü anzuzeigen. Das typische Links-Klick zu überschreiben finde ich ungünstig

MySql · 02.04.2008, 17:15

Nun... Sobald man den Link mit dem OnMouseOver event wieder verläst, verschwindet doch auch das Menü an sich, oder täusche ich mich da(!)?

Es soll ja erst verschwinden, wenn man irgendwo anders hinklickt und nicht den Link mit dem Effekt verlässt. o.o

So ein Scrpit hast du warscheinlich nciht parat, wüsstest du denn, wo ich so eines herbekomme bzw. was man dort evt. bei Google eingeben sollte? Beim letzten mal suchen hatte ich ca. 50 Seiten durch und noch nix gefunden..

Manko10 · 02.04.2008, 17:24

Nein, du darfst das nicht mit der CSS-Klasse :hover verwechseln. Um es wieder verschwinden zu lassen, müsstest du noch onmouseout angeben.
Wenn du aber willst, dass es erst verschwindet, wenn irgendwo anders hingeklickt wird, musst du dem Dokument noch ein mousedown-Event geben:

Code:

if (!document.addEventListener) {
    document.onmousedown = deine_funktion;    // dämlicher IE
} else {
    document.addEventListener("mousedown", deine_funktion, false);
}

MySql · 02.04.2008, 17:29

Danke dir Manko, jetzt muss ich erst einmal bei google schaun ob ich da etwas passendes finde. Das sich als äusert schwirig erweißt... Bin schon wieder auf Seite 25 *g

MySql · 07.04.2008, 17:28

Sorry wegen DP.

Ich mache das jetzt mit nem "Div-Container" + Javascript verstecken.. Klappt auch recht gut dank

PHP-Code:

  $header .= str_replace('{user_menu}',user_menu(),$header);

$footer .= str_replace('{user_menu}',user_menu(),$footer);

!

Füge also {user_menu} in die HTML-Datei ein. Diese HTML-Datei ist einfach nur der Seiten hintergrund. Da ich aber noch nicht dahintergestiegen bin, wie ich DB Abfragen in JS anweden kann musste ich das div in meiner Common festlegen. Klappt auch alles.. *freu

Nur habe ich ein Problem. Undzwar handle ich das durch "OnClick".

Code:

$row['login']

Klappt auch. *fg
Nu wird der Div-Container noch nicht an der Mausposition (bei Linkklick) positioniert.

Meine Frage:

Wie mache ich das, das dieser Div-Container an der Position erscheint, wo ich auf den Link geklickt habe???

Habe es mit:

Code:

document.getElementById('show_menu').style.top = window.event.clientY + 'px';
document.getElementById('show_menu').style.left = window.event.clientX + 'px';

versucht, geht jedoch nicht. Wie auch schon gesagt, fange ich gerade erst mit JS an.

Würde mich über Hilfe freuen..

My.

cycap · 07.04.2008, 17:35

Code:

    var IE = document.all?true:false;
if (!IE) document.captureEvents(Event.MOUSEMOVE)
document.onmousemove = getMouseXY;
var tempX = 0;
var tempY = 0;
function getMouseXY(e) {
if (IE) { // grab the x-y pos.s if browser is IE
tempX = event.clientX + document.body.scrollLeft;
tempY = event.clientY + document.body.scrollTop;
}
else {  // grab the x-y pos.s if browser is NS
tempX = e.pageX;
tempY = e.pageY;
}  
if (tempX < 0){tempX = 0;}
if (tempY < 0){tempY = 0;}  
//document.Show.MouseX.value = tempX;
//document.Show.MouseY.value = tempY;
return true; 
}

MySql · 07.04.2008, 17:43

o.O
Das verstehe ich gerade nicht, sorry.

Code:

function show_menu(acctid) 
    {
		   object = document.getElementById('show_menu');
		          if (object) 
				   {
					  if (object.style.display == 'none')
					   {
						  object.style.display = 'block';
						  object.style.top = window.event.clientY + 'px';
						  object.style.left = window.event.clientX + 'px';
					  }
				  }
				  else {
					  error_report('Element.ID \'show_menu\' ist verschwunden!');
				  }
}

So habe ich es bis jetzt versucht........... Wie müsste es den dann aussehen, das es geht?

MySql · 08.04.2008, 00:36

Nochmal sry.

Bitte Thread wegen dem DP net schließen...

Habe es nun hinbekommen.... Naja teste es alles grundlegend im Opera..

Naja der Internet Explorer streikt

Der öffnet das schei* div nicht.

Hatte die funktion nochmal umgeschrieben. Daher da noch MySQL Variablen rein mussten. Naja sieht noch krüppelhaft aus, daher sie nur zum testen da ist....

Kann mir von Euch wer sagen, warum IE des DIV nicht öffnet??

Code:

<script for=document event='onclick()' language='JScript'>
function show_menu (acctid)
    {
			object = document.getElementById('show_menu');
					var rank = ".$session['user']['superuser'].";
						if (object)
						{
							if (object.style.display == 'none')
							{
							 object.style.display = 'block';
							  if (rank == 0)
							   {
								  /** Kommt noch**/
							  }
							  if (rank == 1)
							   {
								  /** Kommt noch**/
							  }
							  if (rank == 2)
							   {
								  /** Kommt noch**/
							  }
							  if (rank == 3)
							   {
								  /** Kommt noch**/
							  }
						 }
					 }
document.all.show_menu.style.top = window.event.clientY;
document.all.show_menu.style.left = window.event.clientX;
}</script>

habe es auch mit 'event=onmousedown()' und 'type='text/javascript'' versucht..

Bitte...

Lord Edit:

Weiß nun, das es an

Code:

<script .... event='EVENT' ....>

liegt. Wie umgehe ich das? o.O

Edit2:

Hat sich erledigt, musste nur clientX durch x, clientY durch y tauschen und den <script> eintrag verändern.

Edit3:

In FIREFOX geht es nicht :/ Hilfe.......[/b]

cycap · 08.04.2008, 15:23

Weil die Browser unterschiedliche Methoden haben um an die Mauszeigerpositionen zu kommen. Um das nicht alles haarklein auseinander zu nehmen (weil das "warum" ist hier meiner meinung nach mal überflüssig) habe ich dir eine Funktion gegeben die das ganze in den üblichen Browsern für dich organisiert. Kopiere die Funktion einfach in den head-bereich deiner Datei und benutze tempX und tempY für die Mausposition im Rest deines Scriptes

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
JS: Einführung - Javascript im Schichtenmodell	nikosch	Tutorials	4	11.04.2009 17:06
http user mit Javascript abfrage	tennessee	HTML, Usability und Barrierefreiheit	3	31.10.2006 13:18
PHP + Javascript + MYSQL	socke	PHP Tipps 2006	4	02.04.2006 22:02
Wo Php wo JavaScript	dethlef14	Off-Topic Diskussionen	3	03.03.2006 12:34
Ist JavaScript OOP sinnvoll?	HStev	HTML, Usability und Barrierefreiheit	2	26.01.2006 12:11
Variable wird geändert bei Übergabe an Javascript		PHP Tipps 2007	4	17.12.2005 16:53
Javascript durch PHP ausdrücken		PHP Tipps 2007	10	09.11.2005 20:04
Training von neuronalen Netzen		PHP Tipps 2005	5	28.09.2005 15:12
Javascript ON/OFF	Connar	PHP Tipps 2005	3	03.04.2005 09:47
Layer am Ende einer Seite platzieren	php1	HTML, Usability und Barrierefreiheit	2	21.03.2005 22:44
Text in Layer	Stümper	HTML, Usability und Barrierefreiheit	16	23.02.2005 05:26
JavaScript in JavaScript geschriebene Html-Datei einbinden.	woods	HTML, Usability und Barrierefreiheit	6	06.09.2004 18:33
Javascript		HTML, Usability und Barrierefreiheit	5	31.08.2004 18:30
php + Javascript, Variablenübergabe		PHP Tipps 2004	14	28.07.2004 15:42
Div Layer erst nach 2 Sekunden öffnen		HTML, Usability und Barrierefreiheit	1	22.07.2004 18:22

02.04.2008, 16:32
MySql Neuer Benutzer Registriert seit: 02.04.2008 Beiträge: 15	Javascript - Kontextmenü bzw. Layer Hallo Ihr lieben phpfriend'iander, Ich habe vor einer gewissen Zeit mal nach einem Script zur änderung des Kontextmenü's gefunden. Nunja.. geklappt hat es sicherlich.. nur im Opera Browser nicht. Mitlerweile, habe ich mir überlegt das es eh schwachsinn ist das Kontextmenü zu verändern. Daher dort wichtige Elemente gespeichert sind auf die meine User warscheinlich gerne zurück greifen. (Bild speichern, Javascript - Kontextmenü bzw. Layer, etc. pp.) Nun suche ich nach einer Möglichkeit, ein eigenes Kontextmenü oder einen Layer anzeigen zulassen sobald man auf einen Link mit der linken Maustaste klickt. Nun wie ich im Forum Tutorials schon sagte, fange ich gerade erst mit Javascript an und backe mir schon ein Eis weil das mit dem auf und zuklappen geklappt. So stellt sich natürlich heraus, das ich das mit dem eigenen Kontextmenü für einem Klick mit der Linkenmaustaste wohl nicht schaffe. Deshalb bitte ich Euch hier um Hilfe. Villeicht weiß ja jemand wo ich sowas herbekomme oder hat sogar ein Script parat. Es würde mich sehr freuen. Liebe Grüße, MySQL.


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

02.04.2008, 17:12
nikosch moderatives Dielektrikum Registriert seit: 21.05.2008 Beiträge: 35.987 PHP-Kenntnisse: Fortgeschritten	Nimm doch lieber ein MouseOver Event um ein kleines (!) Menü anzuzeigen. Das typische Links-Klick zu überschreiben finde ich ungünstig

02.04.2008, 17:15
MySql Neuer Benutzer Registriert seit: 02.04.2008 Beiträge: 15	Nun... Sobald man den Link mit dem OnMouseOver event wieder verläst, verschwindet doch auch das Menü an sich, oder täusche ich mich da(!)? Es soll ja erst verschwinden, wenn man irgendwo anders hinklickt und nicht den Link mit dem Effekt verlässt. o.o So ein Scrpit hast du warscheinlich nciht parat, wüsstest du denn, wo ich so eines herbekomme bzw. was man dort evt. bei Google eingeben sollte? Beim letzten mal suchen hatte ich ca. 50 Seiten durch und noch nix gefunden.. __________________ ob-games ist noch im Aufbau & ein LotGD. Erwartet nicht zuviel

02.04.2008, 17:24
Manko10 Supermoderator HD Registriert seit: 16.03.2008 Beiträge: 8.706 PHP-Kenntnisse: Fortgeschritten	Nein, du darfst das nicht mit der CSS-Klasse :hover verwechseln. Um es wieder verschwinden zu lassen, müsstest du noch onmouseout angeben. Wenn du aber willst, dass es erst verschwindet, wenn irgendwo anders hingeklickt wird, musst du dem Dokument noch ein mousedown-Event geben: Code: if (!document.addEventListener) { document.onmousedown = deine_funktion; // dämlicher IE } else { document.addEventListener("mousedown", deine_funktion, false); }

02.04.2008, 17:29
MySql Neuer Benutzer Registriert seit: 02.04.2008 Beiträge: 15	Danke dir Manko, jetzt muss ich erst einmal bei google schaun ob ich da etwas passendes finde. Das sich als äusert schwirig erweißt... Bin schon wieder auf Seite 25 *g __________________ ob-games ist noch im Aufbau & ein LotGD. Erwartet nicht zuviel

07.04.2008, 17:28
MySql Neuer Benutzer Registriert seit: 02.04.2008 Beiträge: 15	Sorry wegen DP. Ich mache das jetzt mit nem "Div-Container" + Javascript verstecken.. Klappt auch recht gut dank PHP-Code: `$header .= str_replace('{user_menu}',user_menu(),$header); $footer .= str_replace('{user_menu}',user_menu(),$footer);` ! Füge also {user_menu} in die HTML-Datei ein. Diese HTML-Datei ist einfach nur der Seiten hintergrund. Da ich aber noch nicht dahintergestiegen bin, wie ich DB Abfragen in JS anweden kann musste ich das div in meiner Common festlegen. Klappt auch alles.. freu Nur habe ich ein Problem. Undzwar handle ich das durch "OnClick". Code: $row['login'] Klappt auch. fg Nu wird der Div-Container noch nicht an der Mausposition (bei Linkklick) positioniert. Meine Frage: Wie mache ich das, das dieser Div-Container an der Position erscheint, wo ich auf den Link geklickt habe??? Habe es mit: Code: document.getElementById('show_menu').style.top = window.event.clientY + 'px'; document.getElementById('show_menu').style.left = window.event.clientX + 'px'; versucht, geht jedoch nicht. Wie auch schon gesagt, fange ich gerade erst mit JS an. Würde mich über Hilfe freuen.. My. __________________ ob-games ist noch im Aufbau & ein LotGD. Erwartet nicht zuviel

08.04.2008, 00:36
MySql Neuer Benutzer Registriert seit: 02.04.2008 Beiträge: 15	Nochmal sry. Bitte Thread wegen dem DP net schließen... Habe es nun hinbekommen.... Naja teste es alles grundlegend im Opera.. Naja der Internet Explorer streikt Der öffnet das schei* div nicht. Hatte die funktion nochmal umgeschrieben. Daher da noch MySQL Variablen rein mussten. Naja sieht noch krüppelhaft aus, daher sie nur zum testen da ist.... Kann mir von Euch wer sagen, warum IE des DIV nicht öffnet?? Code: <script for=document event='onclick()' language='JScript'> function show_menu (acctid) { object = document.getElementById('show_menu'); var rank = ".$session['user']['superuser']."; if (object) { if (object.style.display == 'none') { object.style.display = 'block'; if (rank == 0) { / Kommt noch/ } if (rank == 1) { / Kommt noch/ } if (rank == 2) { / Kommt noch/ } if (rank == 3) { / Kommt noch/ } } } document.all.show_menu.style.top = window.event.clientY; document.all.show_menu.style.left = window.event.clientX; }</script> habe es auch mit 'event=onmousedown()' und 'type='text/javascript'' versucht.. Bitte... Lord Edit: Weiß nun, das es an Code: <script .... event='EVENT' ....> liegt. Wie umgehe ich das? o.O Edit2: Hat sich erledigt, musste nur clientX durch x, clientY durch y tauschen und den <script> eintrag verändern. Edit3: In FIREFOX geht es nicht :/ Hilfe.......[/b] __________________ ob-games ist noch im Aufbau & ein LotGD. Erwartet nicht zuviel

08.04.2008, 15:23
cycap Moderator Registriert seit: 13.02.2008 Beiträge: 6.816 PHP-Kenntnisse: Fortgeschritten	Weil die Browser unterschiedliche Methoden haben um an die Mauszeigerpositionen zu kommen. Um das nicht alles haarklein auseinander zu nehmen (weil das "warum" ist hier meiner meinung nach mal überflüssig) habe ich dir eine Funktion gegeben die das ganze in den üblichen Browsern für dich organisiert. Kopiere die Funktion einfach in den head-bereich deiner Datei und benutze tempX und tempY für die Mausposition im Rest deines Scriptes