1

それで、私は 2 つの Web サイトに取り組んできました (Web デザインとコーディングはまだ比較的新しいものです)。私は Dreamweaver で Mac を使用しています。Safari、Firefox、および Chrome でサイトをテストしましたが、すべて問題なく動作しました。PC にアクセスすることはできませんでしたが、Dreamweaver によると、Explorer のブラウザーの競合はありませんでした。とても素晴らしいですよね？

それから数日前、私は PC と Explorer 9 を実行しているオフィスで働き始めました。そこで自分のサイトをテストしたところ、2 つの問題に気付きました。

  1. 私のフロント ページ (www.lesbianzombies.com) には、自動再生のオープニング ビデオ (7 ～ 8 秒) があり、コントロールはありません。Explorer で何らかの理由で - ビデオを再生しますが、ビデオは div/frame から追い出され、ページの残りのメニューを覆います。私は一生、エクスプローラーでこれを行っている理由を理解できません（cssを変更しようとしましたが、何も機能しませんでした）。

  2. 同時に、自動再生されず、コントロールがある他のページの私のビデオ - ビデオは再生されません - Explorer で再生を試みるオプションさえありません。ポスターのみ展示。(例: www.bigthingsproductions.com/projects.html)

私のコードでは、HTML5 ビデオ オブジェクトを使用しています。mp4 オプション、webm、ogg があります。次に、それらが機能しない場合、利用できない場合はフラッシュオプションがあります。私は自分の拠点をカバーしたと思った。

Explorer 7 または 8 でサイトがどのように動作するかをテストできませんでした。そのため、これが v9 だけの問題かどうか知りたいです。これを修正する方法について何か考えはありますか?

以下は、ビデオがフレーム外で再生されているフロントページに使用しているコードです。

<div id="main">
      <div id="homeMain">

       <video id="OpenVideo" width="796" height="546" poster="QueenHome.jpg" autoplay />
  <source src="loading.mp4" type="video/mp4" />
  <source src="loading.webm" type="video/webm" />
  <source src="loading.ogv" type="video/ogg" />
  <!-- Non HTML5 fallback -->
  <object width="796" height="546" type="application/x-shockwave-flash" data="http://fpdownload.adobe.com/strobe/FlashMediaPlayback.swf"> 
  <param name="movie" value="http://fpdownload.adobe.com/strobe/FlashMediaPlayback.swf"></param>
  <param name="flashvars" value="src=http%3A%2F%2Fwww.lesbianzombies.com%2FQueenFront_flash.mp4&controlBarMode=none&poster=http%3A%2F%2Fwww.lesbianzombies.com%2Fimages%2FQueenFront.jpg&playButtonOverlay=false&autoPlay=true"></param>
  <param name="allowFullScreen" value="false"></param>
  <param name="allowscriptaccess" value="always"></param>
  <img src="images/QueenHome.jpg" alt="No video supported." title="No video supported." />
  </object>
  <!-- End Non HTML5 fallback -->
</video>

      </div>
    </div>
    <script src="scripts/videoHandler.js"></script>
  <!-- InstanceEndEditable --><!-- End main -->

また、関連する css:

#main #homeMain {
    margin: 0px;
    padding: 0px;
    background-color: #000;
}

前もって感謝します！

4

0 に答える 0