[GELÖST] lokales MP4-Video wird nicht in lightbox dargestellt - System hängt sich auf

Hallo Leute,

ich hab ein kleines Modul erstellt, wo ich im FE eine Liste mit Videos habe. Sobald ich eines anklicke sollte dies in einer Lightbox dargestellt werden. Leider tut es das nicht. Es wird gleich im ganzen Browserfenster dargestellt.

So sieht mein Template aus:

HTML-Code:

---

<a data-lightbox="" href="<?= \FilesModel::findByUuid($podcast['file'])->path; ?>" title="<?= $podcast['title']; ?>" alt="<?= $podcast['title']; ?>" ><?= $podcast['title']; ?></a>

---

Im Backend hab ich beim Layout in meiner Theme "j_mediaelement" aktiviert.

Wenn ich jetzt zusätzlich noch "j_colorbox" aktiviere, erscheint zwar eine lightbox, aber dann hängt das ganze system. Es wird nichts abgespielt und ich muss den Browser dann auch schließen.

Kann mir das jemand erklären?

So, hab nun eine neue "j_colorbox" im Template mit folgendem Code angelegt:
Leider funktioiniert dies auch nicht. Kann es sein, dass das Video hier deshalb nicht abgespielt wird, da es 20 MB hat?

Wenn ich moo_mediabox lade, funktioniert es. Kann mir das mal jemand erklären?

Hier der Code meiner j_colorbox:

PHP-Code:

---

<?php

// Add the colorbox style sheet
$GLOBALS['TL_CSS'][] = 'assets/colorbox/css/colorbox.min.css|static';

/** *
 * Language options from assets/jquery/colorbox/1.6.1/js/colorbox.js - Contao 3.5.24
 *
 * // internationalization
 * current: "image {current} of {total}",
 * previous: "previous",
 * next: "next",
 * close: "close",
 * xhrError: "This content failed to load.",
 * imgError: "This image failed to load.",
 */

// Language arrays
// All
$cbLang = array(
  'current'  => 'image {current} of {total}',
  'previous' => 'previous',
  'next'     => 'next',
  'close'    => 'close',
  'xhrError' => 'This content failed to load.',
  'imgError' => 'This image failed to load.'
);
// DE
if($GLOBALS['TL_LANGUAGE'] == 'de')
{
  $cbLang = array(
    'current'  => 'Bild {current} von {total}',
    'previous' => 'zurück',
    'next'     => 'weiter',
    'close'    => 'schließen',
    'xhrError' => 'Laden des Inhalts fehlgeschlagen.',
    'imgError' => 'Laden des Bildes fehlgeschlagen.'
  );
}

?>
<script src="<?= TL_ASSETS_URL ?>assets/colorbox/js/colorbox.min.js"></script>
<script>
  (function($) {
    $(document).ready(function() {
      $('a[data-lightbox]').map(function() {
        var isIFrame = false;

        if($(this).attr('href').split('.').pop() == 'html' || $(this).attr('href').indexOf('youtube.com') != -1) {
          isIFrame = true;
        }

        $(this).colorbox({
          // Put custom options here
          loop: false,
          rel: $(this).attr('data-lightbox'),
          maxWidth: '95%',
          maxHeight: '95%',
          width: isIFrame ? '60%' : false,
          height: isIFrame ? '70%' : false,
          iframe: isIFrame,
          // internationalization
          current: '<?= $cbLang['current'] ?>',
          previous: '<?= $cbLang['previous'] ?>',
          next: '<?= $cbLang['next'] ?>',
          close: '<?= $cbLang['close'] ?>',
          xhrError: '<?= $cbLang['xhrError'] ?>',
          imgError: '<?= $cbLang['imgError'] ?>'
        });
      });
    });
  })(jQuery);
</script>

---

Ich hab's. Mensch, hab ja im j_colorbox vergessen mp4 zu definieren.

So sieht's nun aus und es funktioniert:

Code:

---

if($(this).attr('href').split('.').pop() == 'mp4' || $(this).attr('href').split('.').pop() == 'html' || $(this).attr('href').indexOf('youtube.com') != -1 ) {
          isIFrame = true;

---

LG, Andi

Zitat:

---

Zitat von m-werk

Wenn ich moo_mediabox lade, funktioniert es. Kann mir das mal jemand erklären?

---

Ja, das ist eine andere Lightbox ;)