0

YouTube APIを使用して2つのYouTubeビデオを表示しようとしています。最初のビデオが終了すると、2 番目のビデオが表示されます。div スタイルを変更して、2 番目のビデオを非表示にしました。

クロムはページの読み込み時に非表示の div をロードするため、このコードはクロムで機能します。しかし、Firefox はこれを行いません。$("#player").show("fast"); jquery コード。これを行う他の方法はありますか。Firefox でのページ読み込み時に、この div コンテンツを読み込む必要があります。

<div id="jingle"></div>
    <script >
      // 2. This code loads the IFrame Player API code asynchronously.
      var tag2 = document.createElement('script');
      tag2.src = "//www.youtube.com/iframe_api";
      var firstScriptTag2 = document.getElementsByTagName('script')[0];
      firstScriptTag2.parentNode.insertBefore(tag2, firstScriptTag2);
      // 3. This function creates an <iframe> (and YouTube player)
      //    after the API code downloads.
      var jingle;
      function onYouTubeIframeAPIReady() {
        jingle = new YT.Player('jingle', {
          height: '450',
        width: '720',
        videoId: 'lupOKaNHPAA',
           videoId: 'lupOKaNHPAA',
        playerVars: {'wmode':'opaque', 'showinfo':0, 'autoplay': 1, 'rel': 0, 'controls': 0, 'theme': 'light', 'color': 'white', 'modestbranding':1},
          events: {
            'onReady': onPlayerReady1,
            'onStateChange': onPlayerStateChange1
          }
        });
      }

      function onPlayerReady1(event) {
       // event.target.playVideo();

      }

      function onPlayerStateChange1(event) {

       if(jingle.getPlayerState()==0)
        {
            ytplayer.playVideo();
            $("#jingle").hide("fast");
            $("#player").show("fast");




        }
      }


    </script>

<div id="player" style="display:"></div>

<script>

        var tag = document.createElement('script');

        tag.src = 'http://www.youtube.com/player_api';

        var firstScriptTag = document.getElementsByTagName('script')[0];

        firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);



        var ytplayer;

        var interval;

        var stoptime=<?php echo $time;?>;


        var sayi=1;

        var zaman;

        var options = {

            'target': 'player',

            'width': 720,

            'height': 450,

            'videoId': '<?PHP echo $embed;?>',

            'suggestedQuality': 'medium',



            'playerVars': {'wmode':'opaque', 'showinfo':0, 'autoplay': 1, 'cc_load_policy':1, 'cc_lang_pref': <?php if($toplam_dil>=1){echo "'tr'";} else{echo "'en'";} ?>, 'rel': 0, 'controls': 1, 'theme': 'light', 'color': 'white','start': <?PHP echo $s;?>},

            'events': {

                'onStateChange': function(e) {


                    checkTime();

                    showgrade();



                }

            }

        }





        }


        function onYouTubePlayerAPIReady() {


            ytplayer = new YT.Player(options.target, options);



        }



    </script>



<div id="time" style="display:none">0</div>
4

1 に答える 1

0

CSS で display:none と display:block を使用してみてください。これらのプロパティを使用すると、要素が DOM 内にあることが保証されます。

于 2013-01-21T16:45:48.660 に答える