Malte: Verlinkung mittels Wischgeste über ein Bild

Liebes Forum,

ich bin hier Neuling und habe mir mit hilfe von selfhtml eine Seite gebaut, was auch recht gut funktioniert. Nun möchte ich Verlinkungen anhand von Wischgesten einbauen. Unten mein Beispiel.

Ich habe es hinbekommen, dass ich über den Text "Statt Text soll hier das Bild ..." wischen kann und zu den verlinkten Seiten komme. Ich möchte aber über das Bild "fofo.jpg" wischen. Hier komme ich leider nicht weiter, da das Bild nicht erkannt wird. Vielleicht hat jemand Rat für einen Anfänger.

Viele Grüße, Malte

<img src="foto.jpg" width="929" height="611">

<div id="text"><h1>Statt Text soll hier das Bild "foto.jpg" erscheinen, über das man dann wischt</h1></div>

<script type="text/javascript">
	var element = document.getElementById("text");
<!--	var element = document.getElementById("foto.jpg");       DAS KLAPPT NICHT...-->
	Hammer(element).on("swiperight", function(event) {window.location.href = 'fo_01.htm'});
	Hammer(element).on("swipeleft", function(event) {window.location.href = 'fo_03.htm'});
</script>
  1. Hallo,

    <img src="foto.jpg" width="929" height="611">

    <!-- var element = document.getElementById("foto.jpg"); DAS KLAPPT NICHT...--

    dein Bild hat keine ID.

    Warum willst du das Rad neu erfinden? Ich würde nie auf die Idee kommen über ein Bild zu wischen, um auf eine neue Seite zu kommen.

    Gruß
    Jürgen

    1. @@JürgenB

      <img src="foto.jpg" width="929" height="611">

      dein Bild hat keine ID.

      Und keinen Alternativtext. Muss es aber haben.

      Warum willst du das Rad neu erfinden? Ich würde nie auf die Idee kommen über ein Bild zu wischen, um auf eine neue Seite zu kommen.

      Na, da kommt doch sicher noch so ein ℹ️-Dingens auf die Seite, wo ein Fenter aufpoppt, wo beschrieben steht, wie man die Webseite bedienen kann. 😱

      LLAP 🖖

      --
      “When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory
    2. hi,

      Warum willst du das Rad neu erfinden? Ich würde nie auf die Idee kommen über ein Bild zu wischen, um auf eine neue Seite zu kommen.

      Der Trick besteht darin, sich den Finger vorher naß zu machen.

      Im Namen der Rose 😉

      PS: Die gelesene Seite rauszureißen geht natürlich auch.

    3. Ich würde nie auf die Idee kommen über ein Bild zu wischen, um auf eine neue Seite zu kommen.

      Das unterscheidet dich von jedem Smartphone- und vielleicht auch so manchem Schreibtischnutzer.

  2. Hallo Malte,

    <img src="foto.jpg" width="929" height="611">

    <div id="text"><h1>Statt Text soll hier das Bild "foto.jpg" erscheinen, über das man dann wischt</h1></div>

    <script type="text/javascript"> var element = document.getElementById("text"); <!-- var element = document.getElementById("foto.jpg"); DAS KLAPPT NICHT...-->

    Nun ja, dein Foto hat keine ID.

    Bis demnächst
    Matthias

    --
    Rosen sind rot.
    1. Hallo Matthias,

      besten dank für Deine Antwort. Genau daran scheitere ich. Ich hatte des bisher so probiert:

      Var. A	<img id="foto" src="foto.jpg" width="929" height="611">
      
      Var. B	<img src="foto.jpg" width="929" height="611">
      Var. B	<div id="foto"><src="foto.jpg></div>
      
      <script type="text/javascript">
      	var element = document.getElementById("foto");
      	Hammer(element).on("swiperight", function(event) {window.location.href = 'fo_01.htm'});
      	Hammer(element).on("swipeleft", function(event) {window.location.href = 'fo_03.htm'});
      </script>
      

      Der Fehler ist für einen Wissenden wahrscheinlich so vordergründig, dass nur geschmunzelt wird.

      Beste Grüße, Malte

      1. Hi there,

        Der Fehler ist für einen Wissenden wahrscheinlich so vordergründig, dass nur geschmunzelt wird.

        Man muß kein Wissender sein, um sich bei einer Konstruktion wie <src="foto.jpg> an Kopf zu greifen. Schmunzeln ist da nicht mehr. Es gibt kein HTML-Element namens "src". Variante A ist trotz geringer Schwächen auf die Gunnar schon hingewiesen hat eindeutig die bessere Wahl.

        Wenn's mit dem auch nicht geht, dann vielleicht, weil Du im Javascript Funktionen verwendest, die es in Javascript nicht gibt, wenn man nicht dieses jQuery-Zeugs einbindet (was Du vielleicht vergessen hast)…

      2. Var. A <img id="foto" src="foto.jpg" width="929" height="611">

        Das hätte zusammen mit

          var element = document.getElementById("foto");
        

        funktionieren müssen.

        Tipp: Dein Browser sollte irgendwo im Menü einen Entwicklerbereich haben (falls nicht, wechsle zu Firefox oder Chrome), mache dich mit ihm vertraut.

        In der dort enthaltenen Konsole spuckt der Browser einen Haufen hilfreicher Fehlermeldungen aus, alleine diese Funktion ist schon ein Segen. Auch bei deinem Versuch, mit getElementById() auf ein nicht benanntes Element zuzugreifen, wäre ein entsprechender Fehler angezeigt worden und hätte dir langes Raten erspart.

        In dem Bereich findest du noch eine ganze Reihe weiterer Hilfsmittel. Du kannst unter anderem die aufgebaute Seite HTML- und CSS-seitig bearbeiten und die Netzwerkaktivitäten untersuchen. Auch ein Javascript-Debugger, mit dem du Schritt für Schritt deine Skripte beobachten kannst, ist vorhanden.

        Schaue da unbedingt mal rein!

        1. @@Regina Schlauklug

          Tipp: Dein Browser sollte irgendwo im Menü einen Entwicklerbereich haben (falls nicht, wechsle zu Firefox oder Chrome)

          Auch Edge, IE und Safari haben sowas; bei Opera vermute ich das auch. Gibt es irgendeinen relevanten Desktop-Browser, der kein Entwicklerwerkzeug hätte?

          LLAP 🖖

          --
          “When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory
        2. Liebe Regina,

          vielen Dank für Deine hilfreiche Antwort. Zumindest weiß ich nun, dass das theoretisch funktionieren müsste und ich den Fehler woanders suche muss. Ich benutze Firefox, da werde ich mich nun mal umschauen. Und ich merke schon, dass ich hier wohl wirklich zu doofe Fragen stelle. In Zukunft werde ich mich wieder in meiner Fachdisziplin aufhalten...

          Beste Grüße Malte

          1. Liebe Regina,

            noch einmal herzlichen Dank für Deinen Hinweis. Nun läuft alles rund!

            Viele Grüße Malte

          2. Und ich merke schon, dass ich hier wohl wirklich zu doofe Fragen stelle. In Zukunft werde ich mich wieder in meiner Fachdisziplin aufhalten...

            Es gibt keine doofen Fragen, nur doofe Antworten – das gilt in diesem Forum seit einigen Jahren ganz besonders. Die einst fachliche Streitlustigkeit ist überwiegend Großkotzigeit, gegenseitiger Bauchpinselei und herablassendem Verhalten gegenüber Einsteigern gewichen.

            1. Liebe Regina,

              Es gibt keine doofen Fragen, nur doofe Antworten

              dieses Märchen ist nicht von den Gebrüdern Grimm und trotzdem immer wieder sehr beliebt. Doch, es gibt doofe Fragen. Es gibt sogar dumme Fragen! Immer dann, wenn der/die Fragende beim Stellen der Frage offensichtlich das Denken oder die Aufmerksamkeit verweigert hat. In meinem Unterricht kommt so etwas immer wieder einmal vor, dass jemand exakt das fragt, was gerade besprochen wurde. Das war dann eine dummer oder doofe Frage. Insbesondere Fragen, die mit "da steht's doch!" beantwortet werden können (oder gar müssen), sind dumme Fragen.

              Es gibt sie, die dummen Fragen. Wer etwas anderes behauptet erzählt wieder dieses Märchen...

              Liebe Grüße,

              Felix Riesterer.

              1. Hello lieber Felix,

                ich gewinne immer mehr den Eindruck, dass Du mal einen längeren Urlaub brauchst im Real Life, um deinen Empathiespeicher wieder aufzutanken. :-)

                Insbesondere Fragen, die mit "da steht's doch!" beantwortet werden können (oder gar müssen), sind dumme Fragen.

                Wenn eine Frage es wert war, dass dafür irgendwo eine Antwort niedergeschrieben steht, kann es gar keine dumme Frage gewesen sein.

                Dann hat sich bestenfalls der Fragesteller dumm angestellt, weil er z. B. nicht aufgepasst hat ;-P

                Liebe Grüße
                Tom S.

                --
                Es gibt nichts Gutes, außer man tut es!
                Das Leben selbst ist der Sinn.
                1. Lieber TS,

                  Wenn eine Frage es wert war, dass dafür irgendwo eine Antwort niedergeschrieben steht, kann es gar keine dumme Frage gewesen sein.

                  richtig.

                  Dann hat sich bestenfalls der Fragesteller dumm angestellt, weil er z. B. nicht aufgepasst hat ;-P

                  Eben! Und damit war seine Frage eben dumm. Nicht jede Frage, die erneut gestellt wird, hat denselben Wert oder dieselbe Anerkennung verdient, nur weil sie im Wortlaut ähnlich oder gar identisch zu einer zuvor gestellten Frage ist.

                  Und was den Urlaub angeht, hast Du zweifelsohne recht - nur wer erledigt mir dann meine Projekte, für die ich hauptsächlich in den Ferien Zeit aufwenden kann?

                  Liebe Grüße,

                  Felix Riesterer.