Lightbox fixieren: Javascript Freaks gefragt?

[Rolf B]

Hallo Pit,

<a href="images/puente_mujer.jpg" rel="sexylightbox" title="Puente de la Mujer - Buenos Aires - Argentina">
  <img src="images/small_puente_mujer.jpg" alt="" />
</a>

Quelle: http://www.jque.re/plugins/modals-lightboxes/sexy.lightbox/

Auf dein Problem komme ich noch, erstmal diese Anmerkung: Wer solches HTML vorgibt, gehört, wie mein seliger Mathelehrer zu sagen pflegte, standrechtlich mit der Bratwurst erschossen. rel ist kein Freitextattribut. Es wird missbraucht. Aber das fixe ich nicht, im rel kann offenbar noch mehr stehen als nur das sexylightbox Tag. Angesichts der Nichtdoku des Tools bleibe ich davon.

Darüber hinaus wäre es sicherlich auch hilfreich, die Text-Info zum Bild im alt-Attribut des img unterzubringen und nicht (nur) im title des Links.

Zu deiner Lösungsidee: magic content in Textinformationen unterzubringen, der bestimmte Steueraktionen auslöst, sowas habe ich auch schon programmiert. 1990, als ich es noch nicht besser wusste, und ich obendrein keine Chance hatte, ein passendes Datenfeld dafür hinzuzufügen. In den Schnittstellen zu unseren Mainframe-Modulen findet man sowas auch immer wieder. Aber es ist falsch, falsch, falsch! Damit schüttest Du Sambal Oelek auf den gepfefferten Hasen.

Ich habe mir das Fiddle mal angeschaut. Was mir direkt auffällt: In der Console befinden sich schwere Fehler, wenn man jQuery 1.9.1 verwendet, weil das Plugin Teile von jQuery verwendet die seit jQ1.3 deprecated sind und in 1.9 gelöscht wurden. Man muss entweder ein älteres jQuery als 1.9 verwenden oder jQuery Migrate 1.0 dazu laden. Und jQuery UI braucht's auch...

Danach liefert etwas Tracing die Antwort, dass die Lösung bereits in SLB eingebaut ist: man hängt an die URL, die im href steht, ein ?modal=1 an. Dann schließt er nur mit Click auf den Close-Button.

Wenn Du die Möglichkeit haben willst, den modal-Zustand als Default vorzugeben, wäre folgendes zu tun:

• erweitern der Default-Optionen, die von der getOptions-Methode gesetzt werden, um eine Zeile modal: 0,. Zum Beispiel so:

(function($) {
    SexyLightbox = {
        getOptions: function() {
            return {
                name: 'SLB',
                modal: 0,          // <<< RolfB: Globales modal-Flag
                zIndex: 32000,
                color: 'black',

• Erweitern der overlay.show-Funktion (ca Zeile 420), so dass das modal-Flag beachtet wird

           i = $.extend({}, {
                'width': 0,
                'height': 0,
                'modal': this.options.modal ? 1 : 0,   // <<< RolfB: Globales modal-Flag
                'background': '',
                'title': b
            }, i || {});

Und dann kannst Du das einfach beim initialize der sexylightbox verwenden:

     SexyLightbox.initialize( {
      	color:'black', modal:1,
        dir: 'https://www.jque.re/plugins/modals-lightboxes/sexy.lightbox/sexyimages'
      });

modal:1 oder modal:true geht beides, dafür dient das this.options.modal ? 1 : 0 Konstrukt in der 2. Änderung). Fertig.

Bei Zufriedenheit darfst Du gern 10€ an den Self-Verein spenden 😂

Rolf