3

onclick機能で5本の動画のリストを作成しました。ユーザーがそのいずれかをクリックすると、ウェブサイトの上部にあるメインのビデオがビデオに置き換えられます。これは私のコードです。Chrome、IE9+、Firefox では動作しますが、スマートフォンやタブレットでは動作しません。実際にiPhoneとAndroidモバイルで試してみると、機能onclickが機能せず、ビデオが表示されないことがありますが、それは良いものではなく、ホームページをロードするときに自動的に再生されるメインビデオです.

HTML :

  <div id="videox">    
      <div class="carousel carousel-stage">
          <div id="video">
               <div class="flowplayer" data-engine="flash">
                     <div id="css-poster" class="flowplayer minimalist" style="">
                      <video id="videoliste" autoplay >     
                            <source src="video/webdoc_bout_a_bout_rmk.mp4" type="video/mp4; codecs=avc1.42E01E,mp4a.40.2" /> 
                      </video> 
                     </div>
                </div>
          </div>
      </div>
  </div>


<ul>
    <li><img src="photos/p1.png" onclick="afficheliste1('liste1_1')"></li>
    <li><img src="photos/p2.png" onclick="afficheliste1('liste1_2')"></li>
    <li><img src="photos/p3.png" onclick="afficheliste1('liste1_3')"></li>
    <li><img src="photos/p4.png" onclick="afficheliste1('liste1_4')"></li>
    <li><img src="photos/p5.png" onclick="afficheliste1('liste1_5')"></li>
</ul>

JS:

<script type="text/javascript">
var n_video=1;
function afficheliste1(x)
            {
                document.getElementById('videox').style.display = 'block';
                var objet=document.getElementById('videoliste');
                if(objet)
                {
                    objet.src="video/"+x+".mp4";
                    n_video=x.charAt(6);
                }
            }
</script>

ありがとう

4

1 に答える 1

0

モバイル ブラウザで機能させるには、タグにontouchend="afficheliste1('liste1_1')"を追加する必要があります。<img>

于 2013-06-20T03:26:50.917 に答える