web-dev-qa-db-ja.com

ブラウザがサポートされていないときにメッセージを表示する

私のサイトを使用しているInternet Explorer 6のユーザーに、IE6が過去に私のサイトとの深刻な互換性の問題があったことを警告したいと思います。これを行う最良の方法は何ですか？

理想的には、IE6ユーザーに問題を警告し、IE7、Firefox 3またはOperaのいずれかにアップデートすることを推奨するメッセージを表示します（可能な場合は新しいウィンドウではなくメッセージボックス）。 = 9.5。

internet-explorerpopupcross-browser
16
Iwasakabukiman

サポートブラウザー以外の何かであるかどうかを確認する場合は、次のようなjQueryのブラウザー検出を使用できます。

<script type="text/javascript">
// check if browser is IE6 (when IE) or not FF6 (when FF)
if (($.browser.msie && $.browser.version.substr(0,1) == '6')
    || ($.browser.mozilla && $.browser.version.substr(0,1) != '3')) {
        $('#browserWarning').show();
}
</script>

更新：異なる が言ったように、はるかに優れたオプションはIE if次のようなステートメント

<style type="text/css">
/* this would probably be in a CSS file */
#browserWarning { display:none; }
</style>
<!--[if IE 6]>
<style type="text/css">
#browserWarning { display:; }
</style>
<![endif]-->

このオプションは、ブラウザのバージョンが「完全」である必要がないため、はるかに優れています。ただし、ifステートメントをサポートしていない他のブラウザーを検出する場合、これは機能しません。次に、jQueryを使用してブラウザーを検出することもできますが、できるだけ回避することをお勧めします。

8
Darryl Hein

IEをターゲットにする最良の方法は、条件付きコメントを使用することです。その後、Internet Explorerでのみ表示される特定のHTMLを追加できます。

<!--[if IE 6]>
<h1>Please upgrade your browser!</h1>
<![endif]-->

主題の詳細：

http://www.quirksmode.org/css/condcom.html

34
different

わかりました、これを簡単にします。ポップアップなし！統計的な災害。これはの上に座っている素敵な小さなものです。 IE 6またはそれ以前の最大の原因は、デザインを誤用することになるため、私は本当に心配しています。以下は、条件付きステートメントです（私の意見では、最良の方法です）。

頭にこれを貼り付けます（好きなコンテンツを入れてください）：

<!--[if lte IE 6]>
<div id="warning">
<h4 class="red">Your Browser Is Not Supported!</h4><br />
<p>Please upgrade to <a href='http://getfirefox.com'>FireFox</a>, <a href='http://www.opera.com/download/'>Opera</a>, <a href='http://www.Apple.com/safari/'>Safari</a> or <a href='http://www.Microsoft.com/windows/downloads/ie/getitnow.mspx'>Internet Explorer 7 or 8</a>. Thank You!&nbsp;&nbsp;&nbsp;<a href="#" onClick="document.getElementById('warning').style.display = 'none';"><b>Close Window</b></a></p>
</div>
<![endif]-->

これを外部スタイリングシートに貼り付けます。インラインスタイリングは使用しません。

#warning        {position:relative; top:0px; width:100%; height:40px; background-color:#fff; margin-top:0px; padding:4px; border-bottom:solid 4px #000066}

好きなようにスタイルを整えましょう。 JavaScriptを使用して非常に具体的に取得し、任意のブラウザーを検出できます。そのため、方法を知っている場合は、より具体的にすることができます。

これは、コンテンツの上部に配置されるかわいらしいボックスであり、ユーザーがブラウザに問題があることを確認できます。

13
Derrick

https://browser-update.org

ブラウザの更新についてユーザーに通知するWebデザイナーによるイニシアチブ

5
cnmuc

条件付きコメント Internet Explorerの特定のバージョンのコンテンツのみを表示する方法を提供します。

<!--[if IE 6]>
Special instructions for IE 6 here
<![endif]-->
5
dave

Push Up the Webというプロジェクトがあり、すべてのユーザーにブラウザの新しいバージョンにアップグレードするようにアドバイスしています。目立たず、簡単に追加できます。

一部の人が示唆しているように、最善の方法は、条件付きコメントを使用してInternet Explorerを効果的にターゲットにすることです。

他のコメンターにとっては、Internet Explorer 8のリリース（テストする2つのブラウザーを効果的に追加しました：標準+互換モード）により、Internet Explorer 6は順調に進んでいます。今こそそれらの人々がブラウザ、そして場合によってはOS /コンピュータをアップグレードする時です。 Internet Explorer 6は、ウェブの進歩を 抑えています 。これは、サポートするリソースの浪費です。 Netscape 4ステータスに到達しました。主要なサイトや企業も戦いに参加しています。

そしてもっと読む：

5
fearphage

私のアドバイスは、ポップアップウィンドウやメッセージボックスを使用しないことです。それらは非常に迷惑で、ユーザーエクスペリエンスを低下させます。通知とともに_<div>_を挿入して、ページの他の部分から目立つようにしてください。やり過ぎないでください。見落とされないように色を割り当ててください（そして_<blink>_を使わないでください;-)

2
Treb

ユーザーにブラウザを更新するように指示し、実際にそれを実行することは素晴らしいことですが、実際には起こりません。ユーザーが今までにブラウザーをアップグレードしていない場合、通常はその理由、コンピューターの知識の欠如、またはコンピューター自体の制御がないことが原因です。たとえば、従業員が職場のマシンでサイトを閲覧しているとします。

ユーザーが持つ問題の修正を再検討するか、段階的な拡張を検討する必要があると私は本当に思います。 Webサイトの基本的な機能はすべてのブラウザーで機能し、サポートするブラウザーでのみ表示/使用できるように、追加の機能が開発されるという考え方です。

1
John_