0

これは、私が達成しようとしていることの非常に基本的なデモです。

Google Chromeで開く: http://jsfiddle.net/8EbxG/4/

灰色の四角形を除いて、そこには何もないように見えるはずです。

次に、IE9 または Firefox で開きます。

大きなグレーの長方形の中に白い長方形が含まれているのがわかります。

これを chrome Chromeクロス ブラウザのように表示するにはどうすればよいですか(古い IE、Opera、または Safari もテストしていません)。

4

5 に答える 5

1

この CSS を追加します。

#sb-caption:empty {display:none;}
于 2012-10-18T06:27:54.880 に答える
0

コンテンツを削除する： ""; そしてそれはすべてのブラウザで動作します

于 2012-10-18T06:26:15.510 に答える
0

rgba コードの代わりに 16 進数のカラー コードを使用する

 #sb-caption{height:auto; font:12px/36px Arial, Helvetica, sans-serif; position:absolute; right:10px; bottom:10px; background:#ccc}

スペース " " または html 内のテキストを使用します

<div id="sb-wrapper">
  <div id="sb-caption">&nbsp;</div>
</div>​

:D

于 2012-10-18T06:35:56.470 に答える
0
于 2012-10-18T18:40:48.373 に答える
0

最近、IE で疑似要素を機能させるには DOCTYPE を指定する必要があることを思い出しました。

そのため、DOCTYPE が入力されると、ボックスが消えます (少なくともIE9では)。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

そして、使用を提案してくれたmanishieに感謝します：

#sb-caption:empty {display:none;}

Firefoxが動作するためには、それが必要だったと確信しています。

注:このメソッドを使用して、 shadowbox.js でキャプションを作成して<div>います。
テキストは<div id="#sb-caption"></div>JavaScript 経由で入力されます。<a rev=""></a>

例： <a href="LINK" rev="YOUR CAPTION">

rev=""キャプション テキストが表示される場所です。次に、<div>

これは、シャドーボックスの複雑な回避策/ハックの一部です。

これが最終バージョンです：

ChromeとFirefoxについては、こちらを参照してください: http://jsfiddle.net/FBwQd/
(JS-fiddle は DOCTYPE を認識しないため、IE では機能しません)

IE (および/またはChrome ) の場合は、ここで確認できます: http://cssdesk.com/Mrwh8

ボックスが完全に消えるのを確認するには、「TEST」という言葉を削除してください。

于 2012-10-18T18:28:06.330 に答える