• ベストアンサー

HTMLで背景を固定した時の誤動作

1)HTMLで背景を固定(スクロールしても背景は動かないようにする)するため、background-attachment を使いました 2)ところが、スクロールしたところ、添付画面で左側のように表示されるのが正常なのですが、右側(背景がダブって重なる)ようになります 3)ブラウザがfirefoxの場合は正常ですが、IEの場合時々(3回に1回程度)、右側の画面になります 4)再読み込みをして直る場合もありますが、頻発しています 5)文法的には間違っていないと思うのですが、どうすればよいのでしょうか よろしくお願いいたします。

質問者が選んだベストアンサー

  • ベストアンサー
  • torayoshi
  • ベストアンサー率62% (910/1449)
回答No.2

IEでは「背景」として認識出来てないようです。 Firefoxなら正常表示なのはこちらでも確認しました。 原因は不明ですが、こちらで一部手直ししてまったく同じページを再現してみました。 http://www16.plala.or.jp/zaq_501/test/test.html IEでもFirefoxでも正常表示すると思います。 ソースを見比べてみてください。 それから背景は大きな画像を使うより小さな画像を敷き詰めたほうが容量も小さく、 読み込みも早いです。 テストページは小さな画像をリピートしてます。 ※テストページは急造のため、リンク先には飛べません。

kinseiboya
質問者

お礼

ご教示ありがとうございました。 試作いただいたものに沿って変更してうまくいきました。 ありがとうございました。

その他の回答 (1)

回答No.1

再起動するか、IEだけ再インストールってできるんですかね? 最悪の場合OSから再インストール。 メモリを増やすと状態が良くなる場合もありますし、 CPUなど、パソコン全体をもっと高性能なのに買い替える必要があるかもしれません。 いずれにしてもHTMLやCSSは関係ないと思います。

kinseiboya
質問者

お礼

早速の回答ありがとうございました。 ただ、他人などのどのパソコンでも同じ状態です。前に書きましたように、IEで必ず起こると言うわけではなく時々起りますし、Firefox では全く生じません。 よろしくお願いいたします。

関連するQ&A

  • IE以外のブラウザで、背景を固定させる方法

    まったく同じタイトルで、質問されているカタがいらっしゃいましたが、回答を読んでも分からなかったので質問させていただきます。 MS FrontPage 2000でHPを作ったのですが、IEではうまく背景固定がされるのですが、Firefoxでは、背景固定ができず、スクロールすると背景が動きます。 HTMLの部分を見ると、 <body bgcolor="#FFFFFF" text="#000000" background="bear.jpg" bgproperties="fixed" background-attachment:fixed > と言う記述があり、この部分がカギになっているようなのですが、どう変えれば、IEでもFirefoxでも固定されて表示されるのか分かりません。お教えいただけないでしょうか?

  • スマホブラウザでの背景固定

    以下のCSSで背景画像を固定しようと思っています。 PCでは問題なく固定されるのですが、スマホだと 背景画像が固定されず、画面をスクロールすると一緒にくっついてきます。 スマホの場合は別の対処が必要なのでしょうか? body { margin:0 auto; text-align:center; padding:0; background: url(../images/photo01.jpg); background-repeat:no-repeat; background-position:center bottom; background-attachment:fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }

    • ベストアンサー
    • CSS
  • IE6.0 Strictでの背景固定について

    スタイルシートについての質問です。 HTMLをドキュメントタイプStrictに設定した場合、IE6.0では background-attachment : fixed; が無効になってしまいました。(Mozilla系のブラウザでは正常に反映されています) これはIEのバグなのでしょうか?

  • html・cssによる背景の2重設定

    HP制作をしているのですが… 少々デザインを凝ってみようかなー、と考え、 背景の2重設定を思いついたのですが、どうしても表現できないのです。 私が言う背景の2重設定とは… 背景Aと背景Bがあり、背景Aは固定されているのですが、背景Bは画面中央に表示される-というものです。 画面をスクロールをしても背景Bは常に画面中央に表示されていて背景Aの上に背景Bは存在する-という形になっております。 私が試したhtml・cssを以下に記載したいとおもいます。 <html> <head> <title></title> <style type="text/css"> body{ background-image: url(B.jpg); background-repeat: no-repeat; background-attachment: fixed; background-position: center center; } </style> </head> <body background="sozai/haikei/A.gif"> <table width="100%" height="1500" border="0" cellpadding="0" cellspacing="0"> <tr><td> </td></tr></table> </body> </html> -とこのような形になっております。 背景Aを透過gifを用いて背景Bを表示させようと試みたのですが、画面全体に透過gifを用いるとスクロール時に読み込みに時間がかかって…大変ユーザーに見にくくなってしまいました。 質問の回答の程、どうかよろしくお願いいたします。

  • 2つの背景画像固定がうまくいきません

    (1)一番下に細かい画像をrepeatさせた背景を、 (2)その上に大きい画像をno-repeatで中央に表示させ、 どちらも固定させて、その上にテキストやテーブルを表示したいのですが、(2)のbackground-attachment : fixed だけうまくいかずスクロールされてしまいます。 過去の質問に同様の内容があり、それへの回答を参考にしたのですが・・・。 http://oshiete1.goo.ne.jp/qa1133735.html どなたか解決方法を教えて下さい。

  • gaiax系ページでの背景の固定

    こんにちわ。 先日、背景を固定して文字だけスクロールしたいという件で質問しましたところ、スタイルシートをつかったり、bodyタグでの方法を教えて頂きました。ところが、私のページはgaiaxであり、デザインの変更の背景URLのところに教えて頂いたスタイルシートなどのタグを張り付けてみたところ、背景はうまく固定できたのですが、今度は画面の左上に文字の色などを示すタグが勝手に表示され、こちらで設定した文字の色なども無効になってしまいました。スタイルシートではこちらを張り、 <STYLE TYPE="text/css"><!-- BODY{ background-image:url("画像の名前"); background-repeat : no-repeat ; background-attachment : fixed; background-position: bottom right;} --> </STYLE> bodyタグではこちらを試してみました。 <BODY background="○○○" bgcolor="○○○" bgproperties="fixed"> ・・・・・ </BODY> いずれにしても変なタグが画面上部に勝手に表示されてしまうんです。 それに文字なども私は白で設定したのですが、勝手に黒になってしまいます。 どうしたらよいのでしょうか? メインのお知らせ欄に張るということも考えてみたのですが、 そうすると、日記画面での背景は別になってしまいますよね? 御回答よろしくお願い致します。

    • ベストアンサー
    • HTML
  • 固定背景画像と画面幅について

    初心者のため、分かりづらい質問になると思いますがお許しください。 background-repeat:no-repeat; background-position:right; background-attachment:fixed; 上記のようなCSSで背景画像を固定しています。 画面幅は918pxで設定していますが、これをプレビューで918px以上に伸ばすと、背景画像がどんどん右にズレていってしまいます。 画面環境はそれぞれだと思うので、大きな画面で見た方が背景画像が切れてしまうのを避けたいです。 画面幅918pxで固定をしたいのですが、どのようにすればいいのでしょうか? 何か補足事項があればすぐに追記します。 よろしくお願いします。

    • ベストアンサー
    • CSS
  • HTMLサイトのように…(HTMLについて詳しく分かる方お願いします

    <!-- BODY { background-image : url("○○.jpg"); background-attachment: fixed; background-position:0% 100%; background-repeat: no-repeat ; } --> コレを背景画像のタグとせず、HTMLサイトのように、ページに文字として出したいのですが、どうすればできるのですか? 説明下手ですいません´`

  • IE以外のブラウザで背景を固定させる方法

    スタイルシートで、ブログのタイトル部分の背景を固定しています。 IE6.0では画像が表示されるのですが、NetscapeやFirefoxでは表示されず、指定してある背景色だけになってしまします。 #title {background: #000 url("画像のURL") no-repeat; background-position:top;background-attachment : fixed;} このように記述していますが、IE以外のブラウザで表示させるにはどのようにすればいいのでしょうか。

  • DreamwerverMX2004での背景固定がうまくいきません

    お世話になります 実は、背景固定を<head></head>内に指定したのですが、ブラウザでうまく見れません。 ドラッグすると文字がザーっと下につながるようで通常ありえない画面になります。 リンクの際には今の画面と次の画面が重なるように一緒に出てしまいます。 タグは以下の通りです <STYLE type="text/css"> <!-- BODY { background-image : url(sozai/tulip_white01.jpg); background-attachment: fixed; background-position: 100% 100%; background-repeat: no-repeat ; } --> </STYLE> 尚、ブラウザチェックエラーのコメントは background-repeatは再描画上の重大な問題の原因になることがあるため、使用を避けてください となります すみませんが、とても困っています。 誰か教えてください!

専門家に質問してみよう