Iframe und Video in iframe responsive machen

Question

Ich benutze PlusThis für Video-Tracking und der Code unten funktioniert gut, wenn Sie die Desktop-Version der Website anzeigen, jedoch, wenn ich Mobile verwende, ist das Video offensichtlich nicht ansprechend.

Um die PlusThis-Funktion zu verwenden, muss ich unter den Code verwenden, und ich kann nicht herausfinden, wie es reaktionsfähiger machen:

<iframe id="vimeo_187396498" src="https://player.vimeo.com/video/187388888" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe> 
<script type="text/javascript"> 
    PTFeatureBase.setContactId('[memb_contact fields="Id"]'); 
    PTFeatureBase.setContactEmail('[memb_contact fields="Email"]'); 
    PTVideoTriggers.listen({ 
     type: "vimeo", 
     playerId: "vimeo_187399998", 
     feature: "1545-MHe1qQxtRTKCd4cTdB5aDcedYjgJORyfcidK6gv1", 
     triggerType: "cue", 
     times: [660] 
    }); 
</script> 

Könnte jemand bitte zeigen Sie mir, wie dieser Code machen ansprechbar während ich trotzdem das JavaScript intakt halte, um Funktionen von PlusThis nutzen zu können?

Answer 1

PTFeatureBase.setContactId('[memb_contact fields="Id"]'); 
 
    PTFeatureBase.setContactEmail('[memb_contact fields="Email"]'); 
 
    PTVideoTriggers.listen({ 
 
    type: "vimeo", 
 
    playerId: "vimeo_187399998", 
 
    feature: "1545-MHe1qQxtRTKCd4cTdB5aDcedYjgJORyfcidK6gv1", 
 
    triggerType: "cue", 
 
    times: [660] 
 
    });

iframe{ 
 
    width:100%; 
 
    height:auto; 
 
}

<iframe id="vimeo_187396498" src="https://player.vimeo.com/video/187388888" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

Answer 2

<iframe id="vimeo_187396498" src="https://player.vimeo.com/video/187388888" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe> 

verwendet Sie Breite und Höhe innerhalb iframe-Tag. Also, bitte nehmen Sie dieses iframe-Tag in einem div-Bereich und verwenden Sie css iframe als div Kind. Bitte beachten Sie folgendes Beispiel: HTML-Code:

<div class="videoiframe"> 
<iframe id="vimeo_187396498" src="https://player.vimeo.com/video/187388888" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe> 
</div> 

CSS-Code:

.videoiframe iframe {width:100%; height: auto} 

Ich hoffe, Du hast es.