Colorbox Contao 3.x - Bild resize

Wer die Colorbox als Lightbox verwendet, dem mag aufgefallen sein, dass die Skalierung der gross-geklickten Bilder sich nicht der Bildschirmgröße anpasst, sondern die unter den Contao-Einstellungen festgelegte Größe (Dateien und Bilder -> Maximale Frontend-Breite ) als Grundlage verwendet.

Man kann das Colorbox-Template (z.B. j_colorbox.html5) aber leicht kopieren und erweitern, damit sich Bilder, die größer sind als der Browser-Viewport, anpassen.
Hier ein Beispiel, das das Bild auf 95% der Breite und 90% der Höhe des Browser-Viewports skaliert:

Code:

---

<script>
(function($) {
  $(document).ready(function() {
    $('a[data-lightbox]').map(function() {
      $(this).colorbox({
        // Put custom options here
        maxWidth:"95%",
        maxHeight:"90%",
        current:"Bild {current} von {total}",
        loop:false,
        rel:$(this).attr('data-lightbox')
      });
    });
  });
})(jQuery);
</script>

---

Und hier noch eine (wenn auch vielleicht noch nicht perfekte) Möglichkeit, das Bild auch bei einem Browser-Resize neu zu skalieren:

Code:

---

$(function() {
    var timeoutId;

    $(window).on('resize', function() {
        if (timeoutId) {
            clearTimeout(timeoutId);
        }

        timeoutId = setTimeout(function() {
            if ($('#colorbox:visible').length) {
                $.colorbox.load();
            }
        }, 250);
    });
});

---

Ich nutze auch die colorbox, allerdings möchte ich mit dem rel="lightbox" auch gerne mal unterschiedliche größen angeben, bei der mediabox ging das mit rel="lightbox[400 600]" aber wie funktioniert das bei der colorbox?