- ベストアンサー
フレームを装飾したいのですが…
こんにちは。フレームタグで画面を仕切って、 フレームのボーダーラインに素材を使いたいのですが、 そのようなタグがあったら教えてください！！ また、代わりになるようなアイディアがありましたら、 それでも構わないので教えてください。 どうかよろしくお願いしますm（__）m
- nao63_1979
- お礼率5% (1/17)
- HTML
- 回答数3
- ありがとう数2
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
Javascriptでむりやりやる方法です。 画面次第で、調整が必要になります（＝ｗ＝； (用意するもの) img_bak.jpg :ボーダーの背景画像 img1.jpg :ボーダー xx.html スクロールさせるページ (要調整項目) <style> : leftの数値を適切な数値にしてください // 画像サイズ ボーダー画像のサイズ入れてください ImageX = 10; ImageY = 20; <サンプル> <HTML> <HEAD> <TITLE></TITLE> <style type="text/css"> #RPage { position:absolute; top:0px; left:70px;} #img1 { position:absolute; top:0px; left:50px;} #img_bak{ position:absolute; top:0px; left:50px;} </style> <SCRIPT language="JavaScript"> <!-- // 画像サイズ ImageX = 10; ImageY = 20; flag = false; window.document.onmousemove = dragMoveImg; window.document.onmouseup = dragMoveOff; function dragMoveOn(n) { flag = true; imgName = n; } function dragMoveOff() { flag = false; } function dragMoveImg() { if(!flag) return; document.images[imgName].style.top = event.y - ImageY; RPage.style.top = 0-event.y - ImageY; return false; } //--> </SCRIPT> </HEAD> <BODY > <IMG src="img/img_bak.jpg" ID="img_bak"> <IMG src="img/img1.jpg" ID="img1" onMousedown="dragMoveOn('img1')"> <TABLE ID='RPage' border=0 > <iframe src="xx.html" height=300 width=300> </TABLE> </BODY> </HTML>
その他の回答 (2)
- wrina
- ベストアンサー率33% (1/3)
そのボーダーラインを背景に並べれば楽ですよ☆。 [メニュー]l[メイン]とすれば、 [メニュー]の部分に背景としてそのボーダー素材を 縦の繰り返しで左から何pxかあけておき、 フレームをborderなしにしておけば出来ると思います。 CSS使いますけど。 ボーダー線ごと動くのが嫌なら背景固定もしておきましょう。 例） （CSSの記述です、開始、終了の文は省きます） body{background-image: url(画像のアドレス); background-repeat: repeat-y; background-attachment: fixed;←これで背景固定です。 background-position: 0 左からなんぼか;}←0も消してrightってかくと右端にでますけど＾＾ 上のをCSSで書いておいて、フレームのボーダーをなくせば完成です、がんばって下さい♪
- simamee
- ベストアンサー率0% (0/1)
フレームの画面を区切る「枠」の部分には 直接画像を貼ることができなかった気がします。 そこで、私が考えたのは以下二つです。 １．フレームを２分割でなく３分割にする。 つまり、 [コンテンツA]┃[コンテンツB] のような構成から [コンテンツA]┃[任意の素材]┃[コンテンツB] のような構成にするわけです。 フレームの枠の部分を隠してしまえば、 あたかも素材画像で区切られているように見えるでしょう。 ２．二つ目の方法は、[コンテンツA]或いはBの背景画像にうまく素材を使うということです。
