Murmelin: Zweimal derselbe Link macht nicht dasselbe

Hallo,

in einem "Guckfenster" von 600px Breite sehe ich den ersten von sechs 600px breiten Abschnitten x1 bis x6. Per Link in x1 springe ich eine JS Routine an, die den 6er-Block um 600px nach links schiebt. Nun ist x2 im Guckfenster. Von da komme ich nach x3 usw.

x1  x2  x3  x4  x5  x6
+---+---+---+---+---+---+
!   !   !   !   !   !   !
!   !   !   !   !   !   !
+---+---+---+---+---+---+
<-------- 3600px ------->

<a href="#x2" onmousedown='return h_scroll("-600")'>zu Seite 2</a> &nbsp;  

Exakt den gleichen Link habe ich auch auf dem feststehenden Kopf der HTML-Seite, um direkt zu einem der 6 Abschnitte zu scrollen.

Doch da wird offenbar auch href="#x2" ausgeführt. Der 6er-Block springt nach oben und in der Adresszeile des Browsers wird /#x2 angehängt, das war beim anderen Link nicht so.

Ich kann mir nicht erklären, warum der "mitfahrende" Link richtig funktioniert, der "feststehende" aber nicht.

<script type="text/javascript">  
var ist_px = 0, soll_px, diff_px, aktiv;  
function h_scroll(px) {  
  soll_px = px;  
  if ( ist_px > soll_px ) // nach rechts schieben  
  {  
    diff_px = 60; // margin wird groesser  
    scroll();  
  }  
  else if ( ist_px < soll_px ) // nach links schieben  
  {  
    diff_px = -60; // margin wird kleiner  
    scroll();  
  }  
}  
function scroll() {  
  if ( ist_px != soll_px )  
  {  
    ist_px = ist_px -diff_px;  
    document.getElementById('px3600').style.marginLeft = ist_px +'px';  
    aktiv = window.setTimeout("scroll()", 50);  
  }  
  else  
  {  
    window.onmousedown = '';  
    return true;  
  }  
}  
</script>  

Gruß, Murmelin

  1. derselbe Effekt tritt auch auf mit diesem vereinfachten Link:
    <a href="#x2" onmousedown='document.getElementById("px3600").style.marginLeft = "-600px";ist_px="-600";window.onmousedown=""'>

    Einmal wird href="#x2" wie gewünscht ignoriert und beim Link im Seitenkopf zusätzlich ausgeführt.

    1. Habe mal einige Sachen zu Eventhandlern gelesen, die aber nicht in die Tiefe gehen, z.B. http://de.selfhtml.org/javascript/sprache/eventhandler.htm

      Was bitte ist "onclick"? Doch wohl der "onmouseup" nach "onmousedown"?
      Triggern da also drei Events?

      Habe mein Problem unter Linux iceweasel jetzt provisorisch gelöst mit onmouseover. Da wird der href="#x2" nicht angesprochen.

      Ist aber keine endgültige Lösung, weil beim horizontalen Scrollen eine andere Schaltfläche unter den Mauszeiger fährt und das event erneut auslöst.

      Man muss die Maus also schnell nach oben oder unten wegziehen, das kann es nicht sein.

      Habe den "onmousedown" wieder eingesetzt. Und siehe - das scrollen klappt, solange ich die linke Maustaste gedrückt halte (hatte ich vorher nicht ausprobiert). Aber irgendwann muss ich sie wieder loslassen und dann greift href="#x2", der Bereich springt nach oben.

      Wie kann ich das verhindern? Den href="#x2" brauche ich, wenn Javascript ausgeschaltet ist.

      Murmelin

  2. sorry, für die nächtlichen Selbstschreiben hier. Nennt man das Autobiografie?

    Ich kann mir nicht erklären, warum der "mitfahrende" Link richtig funktioniert, der "feststehende" aber nicht.

    Jetzt kann ich's erklären:

    Der "mitfahrende" Link läuft bei "onmousedown" sofort los, ohne "onmoueseup" abzuwarten. Wenn ich die Maustaste loslasse, ist die Schaltfläche nicht mehr unter dem Mauszeiger. Kontrolle: Ganz schnell geklickt - der "Fehler" zeigt sich.

    Diesen Effekt kann ich auch bei den "feststehenden" Links erzeugen. Vor dem Loslassen der Maustaste muss ich den Mauszeiger aus der Schaltfläche ziehen. Dann klappt's.

    Bleibt also die Frage: Wie verhindere ich, dass href="#x2" ausgeführt wird? Ist ja nur für onjavascriptoff gedacht.

    Murmelin

    1. Hallo,

      Bleibt also die Frage: Wie verhindere ich, dass href="#x2" ausgeführt wird? Ist ja nur für onjavascriptoff gedacht.

      das ist eigentlich ein uralter Hut - verhindere die Standardaktion des Links, indem du dafür sorgst, dass dein Eventhandler false zurückgibt. Dann hast du ohne Javascript immer noch die Standardaktion.
      Und dann kannst du auch wieder ganz normal onclick verwenden, damit das Ganze auch so reagiert, wie man es als Nutzer erwartet und gewöhnt ist.

      Ciao,
       Martin

      --
      Arzt:    Gegen Ihr Übergewicht hilft wohl nur noch Gymnastik.
      Patient: Sie meinen, Kniebeugen und so?
      Arzt:    Nein, Kopfschütteln. Immer dann, wenn Ihnen jemand was zu essen anbietet.
      Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
    2. Liebes Murmelin,

      der Browser kennt einige http://de.selfhtml.org/javascript/sprache/eventhandler.htm@title=Mausereignisse.

      Wie Martin schon vor mir schrieb, willst Du das Standardverhalten eines Hyperlinks unterdrücken. Dazu sollte es genügen, wenn Dein Handler ein return false zurück gibt.

      <a href="seite.html#anker" onclick="tuWas(); return false;">tu was</a>

      Da die verschiedenen Events zu verschiedenen Momenten "feuern", solltest Du Dir genau überlegen, ob onmousedown beim Hyperlink die sinnvollste Wahl ist. Mein Beispiel verwendet onclick...

      Liebe Grüße,

      Felix Riesterer.

      --
      ie:% br:> fl:| va:) ls:[ fo:) rl:| n4:? de:> ss:| ch:? js:) mo:} zu:)
      1. Hallo,

        Da die verschiedenen Events zu verschiedenen Momenten "feuern", solltest Du Dir genau überlegen, ob onmousedown beim Hyperlink die sinnvollste Wahl ist. Mein Beispiel verwendet onclick...

        das hat den angenehmen Vorteil, dass es auch dann reagiert, wenn man den Link per Tastatur (oder ganz anderer Navigation) ansteuert und auslöst.

        Ciao,
         Martin

        --
        Der Afrika-Forscher wird gefragt: "Stimmt es, dass man nicht von Löwen angefallen wird, wenn man eine Fackel trägt?" - "Kommt drauf an. Man muss die Fackel sehr schnell tragen."
        Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(