Panzoom: Verwenden Sie geeignete Abmessungen für die Eindämmung

@timmywil wir hatten diesen Fehler vor kurzem, und wir haben gerade einen Fix geschrieben und eine PR geöffnet. Bitte checken Sie aus: https://github.com/timmywil/jquery.panzoom/pull/279/files oder laden Sie es direkt herunter .

@awartani Ich

Das Problem tritt auf, wenn das übergeordnete div kleinere Abmessungen als das Panzoom-Element (das Bild) hat.

@timmywil Irgendeine Idee, wann dies behoben wird? Ich liebe das Projekt wirklich und würde es gerne nutzen :-).

@arkoe Ich denke, Sie haben den falschen Zweig getestet, ich habe Ihr Beispiel aktualisiert. Bitte überprüfen Sie http://jsbin.com/gigadis/edit?html , CSS, JS, Ausgabe

@awartani In Ihrem Beispiel ist das Panzoom-Element (blaues Quadrat) kleiner als das übergeordnete Element. Wenn Sie das Element größer als das übergeordnete Element machen, treten Fehler auf. Bitte beachten Sie auch, dass ich dieses Problem nicht erstellt habe. Ich bin gerade dabei :)

Sorry @arkoe Ich habe angenommen, dass du dieses Problem erstellt hast. Ich verstehe jetzt das Problem und denke, es könnte leicht zu lösen sein. Bitte werfen Sie einen Blick auf Pull Request # 279 speziell:

if (contain === 'invert' || (contain === 'automatic' && zoomAspectH < 1.01)) {
//original code
} else {
//my fix
var originalHeight = height / scale;
var originDiff = (originalHeight - height) / 2;
matrix[5] = Math.max(Math.min(matrix[5], conHeight - originalHeight + originDiff), -originDiff);
}

Da ich nicht viel weiß, wie man die erste if -Anweisung testet und es nicht das ist, wonach ich suche, habe ich die else -Anweisung korrigiert. Ich glaube, wenn Sie den gleichen Fix genommen und ein wenig optimiert haben, werden Sie ihn lösen können.

@awartani Ich habe deine PR benutzt und versucht damit zu spielen. Verbringen Sie schon einige Stunden und scheinen es nicht zu reparieren. Gibt es irgendetwas in Ihrem Kopf, das mich in die richtige Richtung weisen könnte, um dies zu beheben? Danke übrigens für deine schnellen Antworten! Sehr geschätzt.

@arkoe Ich hatte etwas zu versuchen, aber ich muss einsteigen und es versuchen, können Sie einen Beispielcode drücken und ich werde versuchen, es heute Abend zu sehen.

@awartani Ich habe zwei Beispiele hochgeladen, demo.html ist die dist-Datei von @timmywil , demo2.html verwendet Ihren Fix. http://arko.io/x/panzoom/demo.html http://arko.io/x/panzoom/demo2.html

@arkoe Aktualisierte Pull-Anfrage Nr. 279 , um Ihr Problem zu lösen . Leider konnte ich Ihre Beispiele nicht aktualisieren. Lass mich wissen ob es funktioniert.

Danke @awartani. Meine Probleme wurden perfekt behoben!