fancyboxの寸法を変更するために正しいインラインjQuery構文が必要

Question

私はfancyboxを使用してページにiframesを正常に表示しています。私は異なる用途のためにfancyboxiframeの寸法を変えることができる必要があります。私の理解は、jQueryがCSSを修正するための最良の選択肢であると考えていますが、何らかの効果を得ることはできません。

CSSファイルのこれらのCSSの値を変更して再公開すると、正常に動作しますが、ページ上のすべてfancyboxesに適用されます。これらの寸法は、fancyboxesの異なるインスタンスに対してインラインで変更する必要がある寸法です。

私は右のこのfancyboxためfancybox CSS enter code here寸法を変更し、このHTMLの前にインラインjQueryを追加しようとしましたが、私はjQuery構文が間違って取得していますか私は間違った場所に配置することだいずれか。ここでは、多くのjQueryコールのうち、オンラインでの提案に基づいてhtmlで試したコールの例を示します。

訂正や提案をお寄せください。

編集：ファイル内のCSSが機能しています。インラインjQueryコールで".fancybox-slide--iframe .fancybox-content"を使用してもよろしいですか？

Edit2：タイミングの問題がありますか？ jQueryがCSSを変更する前にマークアップが実行されている可能性がありますか？

$(".fancybox-slide--iframe .fancybox-content").css("width", "1200px");

.fancybox-slide--iframe .fancybox-content { 
 
    width : auto; 
 
    height : auto; 
 
    min-width: 600px; 
 
    min-height: 500px; 
 
    max-width : 100%; 
 
    max-height : 100%; 
 
    margin: 0; 
 
    box-shadow: 0 0 16px #999; 
 
    border: 3px solid red; 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="add-track-container"> 
 

 
    <a class="text add-track-container2" data-fancybox data-src="../../test/ytsearch/index.html" href="javascript:;"> 
 

 
     <img class="add-track-icon" src="common/images/desktop_icons/addcircle50.png" alt="Add Track" /> 
 

 
    </a> 
 
</div>

Answer 1

それを考え出しました。私はfancyboxに正しく接続していませんでした。いったん私はそれを固定し、すべてが良かった。

  <script> 
       $('[data-fancybox]').fancybox({ 
        toolbar : false, 
        smallBtn : true, 
        afterClose: function() { 
        parent.location.reload(true); 
       } 
       }) 

       $(".log-reg").fancybox({ 
        toolbar : false, 
        smallBtn : true, 
        iframe : { 
         css : { 
          height : '500px' 
         } 
        } 
       }); 
      </script>