Contao-Camp 2024
Ergebnis 1 bis 4 von 4

Thema: Colorbox - Internes Video

  1. #1
    Alter Contao-Hase
    Registriert seit
    18.07.2012.
    Ort
    Löbau
    Beiträge
    1.137

    Standard Colorbox - Internes Video

    Hallo,

    versuche gerade ein Video was per Contao eingebunden wurde in der Colorbox zu öffnen. Dies hab ich jetzt auch soweit.

    PHP-Code:

                <div style="display:none">
                    <div id="video_<?= $this->id;?>" class="ce_player">
                        <video poster="<?= $this->image;?>" preload="none" controls style="width:100%">
                            <source type="<?= $this->mime?>" src="<?= $this->playerSRC?>" title="<?= $this->title;?>">
                        </video>
                    </div>    
                </div>        
                <a title="<?= $this->title;?>" href="#video_<?= $this->id;?>" data-id="<?= $this->id;?>" data-title="<?= $this->title;?>" data-content="video_<?= $this->id;?>" class="video_local">


            <script type="text/javascript">
            jQuery(document).ready(function(){
                    
                $(".video_local").colorbox({
                    inline: true, 
                    width:"50%"
                });        
            });
            </script>
    Allerdings sind 50% auf dem mobilen Endgeräten recht wenig und hätte es da gern so das es eben 95% der Breite und die Höhe automatisch anpasst. Die Optionen maxWidth: '95%' & maxHeight: '95%' bringen leider nicht.

    Hat jemand eventuell ein Lösungsansatz oder kann die Colorbox was ohne das man große alles alle Breiten & Höhren der Colorbox + Video berechnen muss?
    Liebe Grüße
    WebRoxx


  2. #2
    Alter Contao-Hase
    Registriert seit
    18.07.2012.
    Ort
    Löbau
    Beiträge
    1.137

    Standard

    Heyho,

    sorry fürs pushen. Aber keiner ne Idee
    Liebe Grüße
    WebRoxx


  3. #3
    Contao-Urgestein Avatar von folkfreund
    Registriert seit
    09.04.2010.
    Beiträge
    1.928

    Standard

    Was passiert, wenn du die Breitenangabe ganz weglässt?

    Vielleicht kannst du dann bei laufendem Video mit den Browsertools nachsehen, welche Anpassungen mit normalem CSS möglich sind - dann inclusive media-queries...

  4. #4
    Alter Contao-Hase
    Registriert seit
    18.07.2012.
    Ort
    Löbau
    Beiträge
    1.137

    Standard

    Zitat Zitat von folkfreund Beitrag anzeigen
    Was passiert, wenn du die Breitenangabe ganz weglässt?

    Vielleicht kannst du dann bei laufendem Video mit den Browsertools nachsehen, welche Anpassungen mit normalem CSS möglich sind - dann inclusive media-queries...
    Hab es jetzt so gelöst:
    PHP-Code:
                <div style="display:none">
                    <div id="video_<?= $this->id;?>" class="ce_player">
                        <video poster="<?= $this->image;?>" preload="none" controls style="width:100%">
                            <source type="<?= $this->mime?>" src="<?= $this->playerSRC?>" title="<?= $this->title;?>">
                        </video>
                    </div>    
                </div>
    Code:
    		<script type="text/javascript">
    		jQuery(document).ready(function(){
    					
    			$(".video_local").colorbox({
    				inline: true, 
    				innerWidth:640, 
    				innerHeight:480,
    				maxWidth: '95%',
    				maxHeight: '95%',
    				onComplete:function(){ 
    					$('#cboxTitle').hide();
    					$(this).colorbox.resize(); 
    				}
    			});	
    
    		});
    		
    		</script>
    Passt, auf das resize hätte ich auch eher kommen können
    Liebe Grüße
    WebRoxx


Aktive Benutzer

Aktive Benutzer

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)

Lesezeichen

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •