Pfeiltastensteuerung
0 
Marc Reichelt
0
Pfeiltastensteuerung
Der MartinHi,
ich möchte gerne eine Markierung die sich über einem Bild innerhalb einer Bildauswahl befindet, mit den Pfeiltasten verschieben.
Das hab ich soweit hingekriegt, aber es funktioniert bei mir nur im Internet Explorer (7), nicht in Firefox (2).
code:
<script for=document event="onkeydown()" language="jscript">
if (window.event.keyCode == 37) {rahmen(position-1);}
if (window.event.keyCode == 38) {rahmen(position-$imgPerRow);}
if (window.event.keyCode == 39) {rahmen(position+1);}
if (window.event.keyCode == 40) {rahmen(position+$imgPerRow);}
</script>
Kann sich das jemand erklären? Ich habe leider nur wenig Erfahrung mit Js.
Danke für alle Antworten, Gruss Jens
-
Hallo Jens,
Das hab ich soweit hingekriegt, aber es funktioniert bei mir nur im Internet Explorer (7), nicht in Firefox (2).
code:
<script for=document event="onkeydown()" language="jscript">
if (window.event.keyCode == 37) {rahmen(position-1);}
if (window.event.keyCode == 38) {rahmen(position-$imgPerRow);}
if (window.event.keyCode == 39) {rahmen(position+1);}
if (window.event.keyCode == 40) {rahmen(position+$imgPerRow);}
</script>Kein Wunder - der HTML-Code zum Einbinden des JavaScript ist echt fehlerhaft, zudem gibst du als Sprache "jscript" an, das es auch nur von Microsoft gibt.
Am Besten lernst du erst Mal, wie man JavaScript korrekt in HTML einbindet.Grüße
Marc Reichelt || http://www.marcreichelt.de/
--
Linux is like a wigwam - no windows, no gates and an Apache inside!
Selfcode: ie:{ fl:| br:> va:} ls:< fo:} rl:( n4:( ss:) de:> js:| ch:? sh:| mo:) zu:)-
Okay,
ich hab das jetzt anders implementiert:
<body onkeyup="javascript:cursorsteuerung()">
Die Funktion sieht so aus:
function cursorsteuerung() {
if (window.event.keyCode == 37)
{rahmen(position-1);showBig(position-1);}
if (window.event.keyCode == 38) {rahmen(position-$imgPerRow);showBig(position-$imgPerRow);}
if (window.event.keyCode == 39) {rahmen(position+1);showBig(position+1);}
if (window.event.keyCode == 40) {rahmen(position+$imgPerRow);showBig(position+$imgPerRow);}
}Jetzt meldet die FF-Error-Konsole, window.event hätte keine Properties. Soll so viel heißen, wie window.event.keyCode ist auch eine MS-Erfindung? Wie kann ich stattdessen die Tasteneingeben richtig auslesen und auf Pfeiltasten prüfen?
MFG
jens-
Hallo,
<body onkeyup="javascript:cursorsteuerung()">
das "javascript:" lass mal besser weg - Eventhandler sind generell in Javascript, und so wie es da steht, definierst du nur überflüssigerweise ein Label (eine Sprungmarke) namens "javascript". Da JS sowieso kein "goto" kennt, ist das recht sinnlos.
Übrigens, warum onkeyup und nicht onkeydown? Möchtest du den Effekt der Tastatur-Repeatfunktion aushebeln?
function cursorsteuerung() {
if (window.event.keyCode == 37)
{rahmen(position-1);showBig(position-1);}
[...]
Jetzt meldet die FF-Error-Konsole, window.event hätte keine Properties. Soll so viel heißen, wie window.event.keyCode ist auch eine MS-Erfindung?Gut erkannt. :-)
Die Gecko-basierten Browser geben dem Eventhandler stattdessen das Event-Objekt als Argument mit, anstatt ein globales Event-Objekt zu benutzen.
Ciao,
Martin--
Die letzten Worte des stotternden Beifahrers:
Frei... frei... frei... freilich kommt da was!!-
<body onkeyup="javascript:cursorsteuerung()">
Übrigens, warum onkeyup und nicht onkeydown? Möchtest du den Effekt der Tastatur-Repeatfunktion aushebeln?
Genau so wollte ich das :-) Ausser dem Verschieben der Markierung soll noch in einem anderen Fenster das Originalbild geöffnet werden, was bei schnellem Repeat, denke ich, sonst zu permancelastig ist.
Die Gecko-basierten Browser geben dem Eventhandler stattdessen das Event-Objekt als Argument mit, anstatt ein globales Event-Objekt zu benutzen.
Okay, da ich das nicht gleich verstanden hatte, aber jetzt gelöst schreib ich noch mal meine fertige Lösung für andere User hin:
Funktion:
function cursorsteuerung(event) {
if (event.keyCode == 37) {rahmen(position-1);showBig(position-1);}
if (event.keyCode == 38) {rahmen(position-$imgPerRow);showBig(position-$imgPerRow);}
if (event.keyCode == 39) {rahmen(position+1);showBig(position+1);}
if (event.keyCode == 40) {rahmen(position+$imgPerRow);showBig(position+$imgPerRow);}
}Eventhandler:
<body onkeyup="cursorsteuerung(event);">Gruss
Jens-
Für das Event Capturing ist zweierlei Code von Nöten.
if (navigator.appName=="Netscape")
{window.document.captureEvents (Event.KEYUP);}
window.document.onkeyup = cursorsteuerung;
function cursorsteuerung (evt)
if (navigator.appName=="Netscape")
{
if (evt.which == 37) {//...}
if (evt.which == 38) {//...}
if (evt.which == 39) {//...}
if (evt.whiche == 40) {//...}
}
if (navigator.appName=="Microsoft Internet Explorer")
{
if (event.keyCode == 37) {//...}
if (event.keyCode == 38) {//...}
if (event.keyCode == 39) {//...}
if (event.keyCode == 40) {//...}
}Das an die Funktion übergebene event-Objekt für den Netscape Browser wird vom MSIE ignoriert
Gruß Wastl-
Moin Moin!
Den Quatsch hast Du hoffentlich nicht ernst gemeint! Es gibt mehr Browser, nicht nur Netscape und IE. Dieser Code sollte besser mit K und t geschrieben werden! :-(
Die meisten Browser übergeben einem Event-Handler das Event als Parameter. Der IE und vielleicht noch ein paar andere benutzen stattdessen eine globale Variable für das Event und der Event-Handler hat keinen Parameter. Fragt man im Event-Handler den Parameter ab, so evaluiert dieser zu false. Das kann man sehr einfach ausnutzen:
function meinEventHandler(ev)
{
if (!ev) ev=window.event;
// in allen Browsern ist das Event-Objekt jetzt in ev.
/* event-Behandlung hier */
}Alexander
--
Today I will gladly share my knowledge and experience, for there are no sweeter words than "I told you so".
-
-
-
-
-