Wie kann ein iframe eine fancybox füllen

Ich habe eine schicke Box eingerichtet (http://fancybox.net). Die Größe der Box passt sich automatisch der Größe des Web-Brokers an.Wie kann ein iframe eine fancybox füllen

Jetzt möchte ich einen iframe in der Box haben, um sich zusammen mit der Box zu verkleinern.

Ich habe reaktionsfähige iframes durchsucht, aber die Beispiele zeigen responsive iframes in Bezug auf Browserfenster.

Was ich bin, ist eine Lösung, die iframe erlaubt, sich an die Box anzupassen.

This is a simple link that is fired with jquery: 
<body> 
<a class="Link" file="game" srrc="video/voytox/index.html" 
caption="Caption" ></a> 

and it opens an iframe within the fancybox 

<iframe id ="Player" ></iframe> 
</body> 

this is the jquery: 
$('.Link').click(function(){ 
     var File = $(this).attr('file'); 
     var srrc = $(this).attr('srrc'); 
     //var videoWidth = Number($(this).attr('videowidth')); I can 
     optionally set fixed height and width, but i don't want to do that. 
     //var videoHeight = Number($(this).attr('videoheight')); 



     $('#Player').attr("src", srrc); //this refers to the iframe

Dieses löst das fancybox. Ich setze es zu Testzwecken auf eine feste Breite und Höhe, um zu überprüfen, wie der Iframe die Fancybox füllt. Leider bei 100%, übertrifft es die ausgefallene Box und ist nicht enthalten. Ich möchte es "untergeordnet" an die Größe der Box.

 $.fancybox({ 
      'autoDimensions' : false, 
      'scrolling'   : 'no', 
      'width'    : '800', 
      'height'   : '800', 
      'hideOnOverlayClick' : false, 
      'transitionIn' :'fade', 
      'transitionOut' :'fade', 
      'overlayColor' : '#666', 
      'overlayOpacity': .9, 
      'href' : '#videoPlayer' 

      });

Quelle

2017-05-15 Voytek

Können Sie Ihren Code posten und was Sie bereits versucht haben? Ich nehme an, dass die Breite und Höhe des Iframes bei 100% für Sie nicht funktioniert? –

100% macht es die Boxgröße überschreiten, ich möchte es in der Box enthalten sein. – Voytek

Sie müssen die iframe auf Ihre fancybox anhängen - diese Weise, wenn Sie eine Breite von 100% zuweisen wird es zu seinem übergeordneten Element relativ sein. Momentan sind sie Geschwister.

Quelle

2017-05-15 16:32:53

es scheint, es ist egal, ich tat auch html() und übergab den iframe mit width 100% und height = "100%". Nur Breite wurde auf die volle Breite der Box aufgetragen, Höhe nicht. Wenn ich jedoch verschiedene Werte wie 50, 80 usw. in die Höhe fest codierte, änderte sich die Höhe. Daher weiß ich immer noch nicht, wie ich die Geschenkbox mit einem iFrame füllen soll. – Voytek

Was ich tun muss, ist die Iframe-Höhe auf die Höhe der Box einzustellen. Wie erreiche ich das? – Voytek

Wie kann ein iframe eine fancybox füllen

Antwort

Verwandte Themen