Div hinter Mask verschieben

skee

Mitglied
Hallo,
Gehen wir davon aus, dass ich einen Div-Container mit einem Bild als Hintergrund habe. Innerhalb dieses Divs sind noch ein paar kleine Grafiken verteilt, die Punkte auf dem Hintergrundbild markieren. Größe ca. 800x800

Ich suche nach einer Möglichkeit, eine Maske zu erstellen (ca. 400x400 groß) die nur einen Ausschnitt des Divs anzeigt. Und ich möchte dieses Div (inkl. der Markierungen) innerhalb der Maske herumschieben können.

Ist so etwas möglich? Und wen ja, wie?
Mir fehlt da leider komplett ein Ansatzpunkt...

Danke
Skee
 
Das mit den Markierungen verstehe ich nicht ganz: Erst schreibst Du, dass sie in dem großen Div sind. Und später, dass sie mit dem Masken-Div verschoben werden sollen. Dann müssen sie doch in dem Masken-Div angebracht sein?
Möglicherweise könnte man für die Maske statt eines Div eine transparente Grafik verwenden.
Zum Verschieben mit der Maus habe ich das hier gefunden:
http://jqueryui.com/droppable/
Schau mal, ob es dir weiterhilft.
 
Also nochmal zum besseren Verständnis:
Ich möchte eine Weltkarte mit entsprechenden Markierungen anzeigen (800x800 evtl sogar noch größer). Da ich aber nur einen bestimmten Platz zur Verfügung habe (400x400) möchte ich, dass in dem 400x400 Bereich immer nur ein Kartenauschnitt angezeigt wird und ich die Karte in diesem Ausschnitt herum schieben kann, damit ich sie komplett betrachten kann. Eigentlich wie Google Maps.

gruß
Skee
 
Ich hatte vor ca. einem Jahr eine Webapp entwickelt, mittels derer man auf einer Karte Dinge platzieren kann.
Diese Karte wurde in einen Fabric.js Canvas geladen.
Wenn du auch verschiebbare, skalierbare und rotierbare Marker benutzen willst, würde ich dir Fabric.js (oder vergleichbare Bibliotheken) wirklich empfehlen. Wenn du einen solchen Funktionsumfang nicht brauchst, dann ist die Lösung wahrscheinlich ein "Overkill" ;)
 

Neue Beiträge

Zurück