BGM 뮤직플레이어의 배경을 투명하게 넣어서 홈페이지 배경과 조화시키는 방법
사랑비BGM | 2008. 2. 2. 02:27
BGM 을 홈페이지에 넣을 때 바탕화면과의 조화가 중요한 것 같더군요..
이 점은 BGM 자체의 배경화면색을 투명하게 하는 iframe 코드를 넣으면 됩니다.
--> allowTransparency="true"
방법1-고정된 프레임에 아이프레임으로 넣으실 때
아래는 예제 코드 입니다.. 적용한 예 보기는 클릭 ---> http://music24.kr/tr.htm
<IFRAME src="http://music24.kr/bgm/1.php" width=100% height="21" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" allowTransparency="true" ></IFRAME>
아이프레임으로 넣었을 때 BGM 자체의 바탕화면은 투명하게 하는 코드입니다..
예제->http://lovene.dnip.net/tr.htm
방법2- BGM 을 프레임셋으로 나누어 넣으실 때
지금 http://lovene.dnip.net 와 같이 프레임 셋으로 나누어 넣으실 때는 BGM 을 넣을 프레임
문서(top.htm)를 만드셔서 서버에 올리시고 프레임셋에서 불러오게 하시되.. 그 만드신 프레임
문서에 아이프레임으로 BGM 을 투명하게 넣으시면 됩니다..
BGM 을 넣을 프레임 문서(top.htm)의 바탕화면을 메인프레임의 바탕화면과 같게 하시면 됩니다.
아래는 제 홈페이지에 적용한 예제입니다..
1.프레임셋문서-index.html
---------------------------------------
<html>
<head>
<title>홈페이지용 악세사리 BGM 뮤직플레이어,시계,날씨,큐브</title>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
</head>
<frameset rows="18, 1*" cols="1*" border="0">
<frame name="top" scrolling="no" marginwidth="0" marginheight="0" noresize src=http://music24.kr/top.htm>
<frame name="main" scrolling="auto" marginwidth="0" marginheight="0" src="http://lovene.dnip.net/tt/62" noresize>
<noframes>
<body text="#000000" link="#0000FF" vlink="#800080" alink="#FF0000">
</body>
</noframes>
</frameset>
</html>
=================================================================================
2.BGM 이 들어간 프레임문서(top.htm) -1번 BGM 을 투명하게 아이프레임으로 넣습니다.
----------------------------
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<title>http://music24.kr</title>
</head>
<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red" background="./top_dot.jpg" >
<p ALIGN="CENTER"> <iframe name="status" src="http://music24.kr/bgm/1.php" style="width:986PX;height:18px" frameborder="0" scrolling="no" allowTransparency="true" ></iframe></p>
</body>
</html>
1 번 프레임셋(index.html) 이 2번의 프레임(top.htm)을 불러오고 top.htm 은 배경이 투명한 BGM을 불러오는 거죠..
이상 바탕화면과 조화되게 BGM 을 투명하게 넣는 방법이었습니다..
Recent comment