スクロールバーに画像更に背景固定の場合
-
0 名前: 陸 : 2006/02/14 11:20 [URL]
- スクロールバーに画像をいれたのですが、
更にページ背景を固定したいのです。
URLのソースを見ていただくと解るように
何箇所かに背景固定タグを いれてみました。
各1箇所にしても出来ません・・
スクロールバー用にbackgroundを決めて、
<div style="background:url(URL)" background-attachment: fixed;>
で無理やり呼び出しているので、
やっぱり両立は無理なのでしょうか(ノД・)
他に何かいい方法知ってる方いましたら 教えてくれると幸いです。
-
1 名前: あわよ : 2006/02/14 11:20
- こうゆうことですかね。
すごく自身がないですが。。。
中のテーブルは様子みる為だけなので適当です。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<style type="text/css">
<!--
body{
background-attachment:fixed;
background-color:#447748;
background-image:url(http://www.geocities.jp/arajiru2000/TEXTrightBG.gif
);
scrollbar-3dlight-color#c0c1c2;
scrollbar-arrow-color:black;
scrollbar-darkshadow-color:#c0c1c2;
scrollbar-face-color:#c0c1c2;
scrollbar-highlight-color:#c0c1c2;
scrollbar-shadow-color:#c0c1c2;
scrollbar-track-color:#447748;
margin-top:0px;
margin-left:0px;
margin-right:0px;
margin-bottom:0px;
}
.imgscroll{
filter:chroma(color=#c0c1c2);
}
-->
</style>
<title></title>
</head>
<body scroll="no">
<div class="imgscroll" style="width:100%;height:100%;overflow:auto;background-color:#c0c1c2">
<table border="1" align="center" summary="">
<tr>
<td width="162">a</td>
</tr>
<tr>
<td height="195">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</td>
</tr>
<tr>
<td height="176">a</td>
</tr>
<tr>
<td height="50">aaa</td>
</tr>
<tr>
<td height="250">a</td>
</tr>
</table>
</div>
</body>
</html>
-
2 名前: 陸 : 2006/02/14 11:20
- Σ( ̄▽ ̄;Aすごい
横スクロールバーにも画像がw
どこを変えたのかちょっと解らないですが、
いじっている間に理解していけるかも。。
本当にありがとうございました。><。
-
3 名前: 匿名希望 : 2006/02/14 11:20
- OperaやFirefoxで見ると愉快なことになる、ということをお忘れなく
-
4 名前: あわよ : 2006/02/14 11:20
- 見直したら、必要でない記述がありましたので
修正させていただきました。
filter:はIE独自仕様なので、匿名希望さんのおっしゃる通り
愉快なことになりますね。
あとは、ページ全体が重くなります。
さらに画像をいっぱい貼ると重くなると思います。
*一応の解説*
『変更前』
serif;background-attachment:fixed;
background-position:right;
background-image:url(http://www.geocities.jp/arajiru2000/sb10.gif
);
background-repeat:repeat-y;
陸さんのこの部分↑スクロールバーの設定の部分を変えて
『変更後』
↓ページ全体のBODYに反映させたやり方にしてみました。
background-attachment:fixed;
background-color:#447748;
background-image:url(http://www.geocities.jp/arajiru2000/TEXTrightBG.gif
);
背景画像をスクロールバー用、ページの背景用と分けず、
ページの背景用の画像でスクロールバーの画像も出してしまおうと。
陸さんの、スクロールバー設定の時に
background-position:right;
background-repeat:repeat-y;
background-image:url(http://www.geocities.jp/arajiru2000/sb10.gif
);
となっていて、スクロールバーの部分にしか画像が来ないようにしてあったのを
単純にページ全体にその画像を反映させれば良いだけですよね?
なので
background-position:right;
background-repeat:repeat-y;
この部分を取り去り、背景をこちらの画像にしてみました。
background-image:url(http://www.geocities.jp/arajiru2000/TEXTrightBG.gif
);
以上です。
こういうことができることを、私も今回始めて知ったので
とても良い勉強になりました。
-
5 名前: 陸 : 2006/02/14 11:20
- あわよさん匿名希望さん本当にどうもありがとうございました。
とっても詳しくて助かります。
そうですよね、憶測でしたがスクルールバーに「だけ」
背景を反映させるためのタグが わざわざどこかに隠れていると
感じておりました。
なんだかいろいろいじっていたら、
バーのための画像はなくなり、
背景用の画像がバーに行った現象がおきたので、
うっすら気づいていました。
しかし、理屈がどうしても知りたかったので本当に助かります。
ただ、背景画像を固定させたい場合は
バーには別の画像を使えないことも勉強になりました。
本当にありがとうございました。