フレームページのスクロールバーを装飾する。
忍者で二分割のサイトを作っている者です。
ページ全体のスクロールバーを装飾する事は出来ましたが、フレームページのスクロールバーを装飾する事が出来ません。
同時に、フレームページのスクロールを上下だけにしたいと思っています。
私の予想では、
<HEAD>
<style type="text/css">
<!--
body{ overflow-x:hidden; }
-->
</style>
</HEAD>
<BODY>
<STYLE TYPE="text/css">
<!--
Body{
scrollbar-3dlight-color:#2f4f4f;
scrollbar-arrow-color:#2f4f4f;
scrollbar-darkshadow-color:#ffffff;
scrollbar-face-color:#ffffff;
scrollbar-highlight-color:#ffffff;
scrollbar-shadow-color:#2f4f4f;
scrollbar-track-color:#ffffff;
}-->
</STYLE>
</BODY>
↑このHTMLでスクロールを上下だけにし、スクロールバーを装飾できるのですのですが、肝心の入れる場所が分かりません。
↓サイトのHTML
<table border="0" cellspacing="0" cellpadding="0" width="100%" height="100%">
<tbody>
<p>
<tr>
<td style="border-bottom: black 1px solid; border-left: black 1px solid; border-top: black 1px solid; border-right: black 1px solid" class="t" height="40%" valign="middle" width="40%" nowrap="nowrap" align="center">
<h1><br />
<tt>L・L・B</tt></h1>
<!--ここからメニュー変更箇所>
<td height="40%" width="60%" nowrap="nowrap" align="right"><img alt="" src="?http://*****/yanekko01.gif"? /></td>
</tr>
<tr>
<td height="60%" valign="top" width="40%" nowrap="nowrap" align="center">
<div class="copyright">since-2010.4.10<br />
<br />
<br />
<br />
<img alt="" src="?http://*****/simpleVC_img/nitizyou3.gif"? /></div>
</td>
<td style="border-bottom: black 1px solid; border-left: black 1px solid; border-top: black 1px solid; border-right: black 1px solid" height="60%" valign="top" width="60%" align="center"><iframe height="100%" src="i.html" frameborder="0" width="100%" name="a" scrolling="yes" align="middle"></iframe><br />
<br />
</td>
</tr>
</p>
</tbody>
</table>
少しHTMLを省略しましたが、こんな感じです。
何処に入れればいいのかを教えて下さい!
No.2ベストアンサー
- 回答日時:
>スクロールバーの装飾のHTMLは、
>質問に書いてあった<iframe~>から</iframe>の間に書けばよいのでしょうか?
念のために確認したいのですが、
忍者でサイト作っているとのことですが、
かんたん管理ページを使って作成しているわけではないですよね?
それを前提にします。
(かんたん管理ページの場合、<head>~</head>間に記述する方法ではなくて、
<td style="~
のように要素に直接、スタイル設定を書き込む方法じゃないと、上手くいかないことがあるので)
<iframe>(インラインフレーム)でのスクロールバーの色変更は、
インラインフレーム内に表示されるページに直接設定します。
質問に書いてあった
<iframe height="100%" src="i.html"
だと、i.htmlに直接、スクロールバー色変更の設定をすればよいだけです。
参考:インラインフレームのスクロールバーの色を指定するhttp://www.tagindex.com/stylesheet/frame/scrollb …
No.1
- 回答日時:
二分割のフレームページとありましたが
index.html・menu.html・main.htmlという3つで構成されていて
片側フレーム(例えばmenu.html)のスクロールバー装飾だった場合、
menu.htmlに同じようなスタイルを書き込むことで可能です。
また<iframe>のタグを記載されていましたので、
そのの装飾の場合は
iframe {
scrollbar-3dlight-color:#2f4f4f;
scrollbar-arrow-color:#2f4f4f;
scrollbar-darkshadow-color:#ffffff;
scrollbar-face-color:#ffffff;
scrollbar-highlight-color:#ffffff;
scrollbar-shadow-color:#2f4f4f;
scrollbar-track-color:#ffffff;
}
でいけると思います。
余談ですが、参考のソースにて<body>直下にCSSを定義しているのは意図があってなのでしょうか?
<style type="text/css">
<!--
body{ overflow-x:hidden; }
-->
</style>
</HEAD>
<BODY>
<STYLE TYPE="text/css">
<!--
Body{
scrollbar-3dlight-color:#2f4f4f;
scrollbar-arrow-color:#2f4f4f;
scrollbar-darkshadow-color:#ffffff;
scrollbar-face-color:#ffffff;
scrollbar-highlight-color:#ffffff;
scrollbar-shadow-color:#2f4f4f;
scrollbar-track-color:#ffffff;
}-->
</STYLE>
これって、↓でいけるのでは?
<style type="text/css">
<!--
body{
overflow-x:hidden;
scrollbar-3dlight-color:#2f4f4f;
scrollbar-arrow-color:#2f4f4f;
scrollbar-darkshadow-color:#ffffff;
scrollbar-face-color:#ffffff;
scrollbar-highlight-color:#ffffff;
scrollbar-shadow-color:#2f4f4f;
scrollbar-track-color:#ffffff;
}
-->
</style>
いかがでしょう?
<body>直下のCSS定義は無意識にしていました・・。
書いてくださった方のHTMLに直しました。
スクロールバーの装飾のHTMLは、質問に書いてあった<iframe~>から</iframe>の間に書けばよいのでしょうか?
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- HTML・CSS アコーディオンメニューが思うように動作しません。 1 2023/08/20 16:48
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
- JavaScript vertical sliderをautoplayしたい 2 2022/08/25 14:47
- HTML・CSS (Javascript)印刷するファイルに応じて印刷プレビュー画面で用紙を自動的に切り替えたい!! 2 2022/04/11 12:04
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- HTML・CSS CSSがなぜかfont-sizeだけ効かない...記述がまちがっているんでしょうか 5 2022/04/09 17:52
- HTML・CSS HTML & CSS 縦ボックス内の文字の左右センタリング 3 2023/03/25 04:23
- HTML・CSS CSS のみのタブ切り替えについて 1 2023/01/11 16:47
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
tableタグとformタグの組み合わせ
-
html でのテキスト結合について
-
td要素内のdiv要素をセンタリン...
-
テーブルの一部分のセルだけに...
-
Firefoxを使ってるのですがズー...
-
formのinputなどの幅100%指定
-
divで囲んだ文字が消える
-
Tableタグ内のspan styleが適応...
-
vbscriptで時計を作りたい
-
HTMLでテーブルタグ<table>を使...
-
テーブルの線を点線にする
-
Tableタグで作成した表の縮小
-
リストの記号を括弧付きの文字...
-
テーブル内のテーブルの高さを...
-
スタイルシートでpaddingを使う...
-
テーブル内に棒グラフを作る方法
-
Visual Studio で CLR 開発でデ...
-
自身のHPにYouTube動画を貼り付...
-
縦書きのテーブル
-
td width="180" と固定してるの...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
html でのテキスト結合について
-
tableタグとformタグの組み合わせ
-
特殊文字の検索方法
-
テーブルの一部分のセルだけに...
-
同じクラス名はつけないほうが...
-
Tableタグで作成した表の縮小
-
td要素内のdiv要素をセンタリン...
-
Tableタグ内のspan styleが適応...
-
テーブル内のテーブルの高さを...
-
formのinputなどの幅100%指定
-
divで囲んだ文字が消える
-
cssで、テーブルのtdの中の文字...
-
vbscriptで時計を作りたい
-
HTMLのテーブルでそれぞれの大...
-
td width="180" と固定してるの...
-
同じwidth=200でもセル内の文字...
-
ブラウザによってテーブルのセ...
-
TDタグ内での均等割付の仕方
-
表とリスト(ulとtable)の違い...
-
<img>タグにCSSのclass設定可能?
おすすめ情報