Dynamischer Slider

  • Hallo zusammen,


    ich bin auf der Suche nach einer Art Slider der in Abhängigkeit auf einer Karte geklickter Standorte (Als Bild) Informationen und Bilder dazu anzeigen soll.


    Ich stelle mir das so vor, dass es zwei Spalten gibt. Links ist eine Deutschlandkarte als Bild mit mehreren eingezeichneten Standorten und in der rechten Spalte der Standortslider, der je nach Klick auf den Kartenstandort Informationen wechselt.

    Das ganze soll auch umgekehrt funktionieren. Wechsle ich im Slider den Standort, soll dieser auf der Karte links farblich hervorgehoben werden.


    Gibt es dafür eine Lösung in JavaScript oder Jquery oder hat jemand eine Idee, wie so etwas umsetzbar ist?


    Danke schon einmal :-)

  • Meistens wird eher gewünscht, dass ein Tooltipp beim Hover oder Klick aufgeht, also ein kleines Fenster mit weiteren Informationen. Dafür gibt es zahlreiche vorgefertigte Lösungen. Bei deiner Aufgabe glaube ich eher nicht, dass es etwas komplett fertiges gibt. Für den Slider jedoch schon, da gibt es ebenfalls zahlreiche. Selber benutze ich Swiper, der hat eine API, die keine Wünsche offen lässt und funktioniert auch auf Touch-Geräten. Für den Rest ist dann wohl selber machen angesagt. Was ist das denn für ein Bild? Raster, also JPG, PNG o. ä. oder Vector (SVG)? Und soll das Ganze auch responsiv sein?

  • Ich habe das ganze mal skizziert, wie ich mir das vorstelle und diesem Beitrag angehängt. Mein Ansatz wäre die linke Karte mit den Standorten als Imagemap zu gestalten und dann bei Klick auf der rechten Seite das jeweilige Standortbild anzuzeigen. Es soll also kein Fenster aufgehen, sondern eben die Information in einem festen Bereich auf der rechten Seite erscheinen.


    Das heißt der Slider müsste irgendwie mit den Punkten auf dem Bild verknüpft werden, damit das ganze auch andersherum funktioniert. Da fehlt mir noch die Idee...


    Ich hätte auch eigentlich gedacht, dass es so etwas schon geben könnte im Web, habe bisher aber auch nichts gefunden.