web-dev-qa-db-ja.com

Firefoxのフラッシュで許可ボタンをクリックできません

いくつかのフラッシュコンテンツをiframeに埋め込んだウェブアプリがあります。フラッシュ部分はウェブカメラへのアクセスを要求しています。 Firefox/Mac OSでは、ユーザーは許可ボタンをクリックできません。これは、swfファイルを埋め込んだページがiframeに読み込まれた場合にのみ発生し、個別に配置すると正常に機能します。他の誰かが同様の問題に直面しましたか？回避策を知っていますか？

編集：将来の参考のために：JSを介していくつかのものを配置し、「ハーフピクセル」（例：20.5px）を使用して配置しました。すべてが正常に機能することを修正したら。

flashfirefox
19
Alex

このバグは、CSSでmarginautoを使用する場合にも存在することがわかりました。

たとえば、固定幅と中央揃えのレイアウトでは、「margin：0pxauto;」を使用するのが一般的です。コンテンツを適切に中央に配置します。これにより、コンテンツに対して可能な（可能性が高い）10進数の左/右マージンが適切に生成されるようです。これはFirefoxにとって実際には問題ではありません。10進数のピクセルオフセットを問題なく処理します。

しかし、Flashウィジェットは、オブジェクトコンテナが10進数のピクセル値で配置されていると、完全にびっくりするように見えます。少なくとも、[許可]ボタンを操作することはできません。私には、これがこのバグの根本的な原因であるように思われます（少なくともFFに関係しているため）。

なぜFFでしか発生しないのか、よくわかりません。私のOSXマシンでは、SafariとChromeは、フラッシュオブジェクトではこの動作を示しません。おそらく、WebkitのすべてのDOM要素は、丸められたピクセルオフセット値で自動的にレンダリングされますか？

Firefoxの場合、この回避策を実装しました（中央揃えのデザインに役立ちます）。

$(document).ready( function() {
  repositionContentContainer();
});

function repositionContentContainer() {
  // this routine is a complete hack to work around the flash "Allow" button bug
  if ( $("#content").length > 0 ) {

    //Adjust the #content left-margin, since by default it likely isn't an int
    setLeftMargin();
    //If the User resizes the window, adjust the #content left-margin
    $(window).bind("resize", function() { setLeftMargin(); });
  }
}

function setLeftMargin() {
  var newWindowWidth = $(window).width();
  var mainWellWidth = $("#content").width();
  // create an integer based left_offset number
  var left_offset = parseInt((newWindowWidth - mainWellWidth)/2.0);
  if (left_offset < 0) { left_offset = 0; }
  $("#content").css("margin-left", left_offset);
}
16
sghael

wmodeを 'direct'に設定すると、これが修正されました。
「margin」/「position」の値を整数として設定する必要はありません。

'direct'wmodeはFlash10以降で使用可能であり、IEでは機能しないことに注意してください

7
younes0

この問題は、Adobeのバグデータベースで追跡されています。

http://bugs.Adobe.com/jira/browse/FP-4656

基本的な問題は、Firefoxがハーフピクセルの配置を使用し、Adobeがサイズ変更後に不規則に使用することです。これは、ページの中央に配置されたswfを介して発生します。または、ほとんどのFacebookアプリのように、swfが中央に配置されたiframe内にある場合はさらに悪化します。

そこには、ブラウザーのズーム、サイズ変更、およびその他の複雑さをカバーするソリューションマトリックスが掲載されています。

3
greg.kindel

また、CSS変換ルールを持つ親div（またはdiv自体）がないことも確認してください。例：

transform: translateX(-50%);
0
Andrea

これは古い質問ですが、同じバグを引き起こしている別の問題を発見したばかりです。これがGoogleの上位の結果であるため、この回答を追加します。

ページの背景（おそらくコンテナのdivの背景にも）のCSS3グラデーションもこの問題を引き起こします。グラデーションを削除すると、ボタンが再びクリック可能になります。

0
gingerchris