묻고답하기

  2. Support
  3. 묻고답하기

홈페이지 만들때요, 이런 방식은 어떻게 하는지 고수님들의 답변부탁드릴게요..

2004.04.21 14:41

박현진

http://chocorato.com

http://www.toonzoo.co.kr/#

이 사이트의 공통점을 보면요, 주변에 이미지들이 있고, 가운데 네모난 박스안에 게시판등이 설치되어 있는데요..

프레임으로 나눈것 같지는 않고... 저두 홈피를 이런 형식으로 만들고 싶은데요.. 어떻게 해야하는지 너무 궁금해요..

답변좀 부탁드릴께요..



첫번째 사이트의 소스를 보니까요.. 이런 형태로 되어 있더라구요...



<HTML>

<head>

<style type="text/css">

body

{scrollbar-face-color: #ffffff;

scrollbar-highlight-color: #ffffff;

scrollbar-3dlight-color: #ffffff;

scrollbar-shadow-color: #ffffff;

scrollbar-darkshadow-color: #ffffff;

scrollbar-track-color: #ffffff;

scrollbar-arrow-color: #ffffff}

</style>

<title>★chocorato★</title>

<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">

<bgsound src="http://icon.sie.net/midi/mabab.mid" loop=-1>

</head>

<body bgcolor="#ffffff" text="#000000" leftmargin="0" topmargin="5 marginwidth="0" marginheight="0" background="images/main_21.gif">

<table width="100%" border="0" cellspacing="0" cellpadding="0" height="100%">

<tr>    

  <td valign="top" align="center">

    <TABLE WIDTH=1100 BORDER=0 CELLPADDING=0 CELLSPACING=0>

        <TR>

                <TD>

                        <IMG SRC="images/main_01.gif" WIDTH=235 HEIGHT=81></TD>

                <TD>

                        <IMG SRC="images/main_02.gif" WIDTH=221 HEIGHT=81></TD>

                  <TD> <IMG SRC="images/main_03.gif" WIDTH=542 HEIGHT=81 usemap="#Map" border="0"></TD>

                <TD>

                        <IMG SRC="images/main_04.gif" WIDTH=102 HEIGHT=81></TD>

        </TR>

        <TR>

                <TD>

                        <IMG SRC="images/main_05.gif" WIDTH=235 HEIGHT=235></TD>

                <TD>

                        <IMG SRC="images/main_06.gif" WIDTH=221 HEIGHT=235></TD>

                <td rowspan=3 valign="center" bgcolor="#ffffff"><iframe name="main" src="http://chocorato.com/bbs/zboard.php?id=notice" frameborder="0" width="100%" height="100%" marginwidth="0" marginheight="0" scrolling="auto" style="border:0 solid navy">

                  <table width="542" border="0" cellspacing="0" cellpadding="0" height="490">

                    <tr>

                      <td height="490"> </td>

                    </tr>

                  </table>

                  </iframe></td>

                <TD>

                        <IMG SRC="images/main_08.gif" WIDTH=102 HEIGHT=235></TD>

        </TR>

        <TR>

                <TD>

                        <IMG SRC="images/main_09.gif" WIDTH=235 HEIGHT=146></TD>

                <TD>

                        <IMG SRC="images/main_10.gif" WIDTH=221 HEIGHT=146></TD>

                <TD>

                        <IMG SRC="images/main_11.gif" WIDTH=102 HEIGHT=146></TD>

        </TR>

        <TR>

                <TD>

                        <IMG SRC="images/main_12.gif" WIDTH=235 HEIGHT=109></TD>

                <TD>

                        <IMG SRC="images/main_13.gif" WIDTH=221 HEIGHT=109></TD>

                <TD>

                        <IMG SRC="images/main_14.gif" WIDTH=102 HEIGHT=109></TD>

        </TR>

        <TR>

                <TD>

                        <IMG SRC="images/main_15.gif" WIDTH=235 HEIGHT=79></TD>

                <TD>

                        <IMG SRC="images/main_16.gif" WIDTH=221 HEIGHT=79></TD>

                <TD>

                        <IMG SRC="images/main_17.gif" WIDTH=542 HEIGHT=79></TD>

                <TD>

                        <IMG SRC="images/main_18.gif" WIDTH=102 HEIGHT=79></TD>

        </TR>

</TABLE>

</table>

<map name="Map">

  <area shape="rect" coords="473,62,506,80" onFocus='this.blur()' href="http://chocorato.com/box" target="main">

  <area shape="rect" coords="432,63,467,80" onFocus='this.blur()' href="http://chocorato.com/bbs/zboard.php?id=link" target="main">

  <area shape="rect" coords="379,62,423,81" onFocus='this.blur()' href="http://chocorato.com/guest" target="main">

  <area shape="rect" coords="257,63,295,80" onFocus='this.blur()' href="http://chocorato.com/bbs/zboard.php?id=photo" target="main">

  <area shape="rect" coords="207,62,246,81" onFocus='this.blur()' href="http://chocorato.com/bbs/zboard.php?id=diary" target="main">

  <area shape="rect" coords="163,62,199,80" onFocus='this.blur()' href="http://chocorato.com/work" target="main">

  <area shape="rect" coords="44,63,81,81" onFocus='this.blur()' href="http://chocorato.com/bbs/zboard.php?id=notice" target="main">

  <area shape="rect" coords="90,62,156,79" onFocus='this.blur()' href="http://chocorato.com/chocorato" target="main"">
</map>

</BODY>

</HTML>



두번째 사이트 주소의 우사기님의 홈페이지 인데요... 이 분의 소스는 이렇게 되어 있더라구요..


<html>
<head>
<title>:::::해피툰주 Ver.3:::::</title>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
<script language="JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v3.0
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>

<body onload="fall()" oncontextmenu="return false" ondragstart="return false" onselectstart="return false" bgcolor="#CCCCCC" leftmargin="0" topmargin="1">

<div id="Layer3" style="position:absolute; left:1037px; top:639px; width:76px; height:23px; z-index:3; visibility: visible"><font size="1">
  <a href =http://okcounter.com/kr_status.html?id=261159 target=_blank> <img src=http://okcounter.com/count.html?id=261159 border=0></a>
  </font></div>
<table width="1103" border="0" cellpadding="0" cellspacing="0" height="638" align="center">
  <tr align="left" valign="top">
    <td height="93" width="68"><img src="main/01-01.gif" width="68" height="93"></td>
    <td height="93" width="136"><img src="main/02-01.gif" width="136" height="93"></td>
    <td height="93" width="101"><a href="new.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image75','','+ '+ 'main/03-01-1.gif',1)" target="ham" onfocus='this.blur()'><img name="Image75" border="0" src="main/03-01.gif" width="101" height="93"></a></td>
    <td height="93" width="29"><img src="main/04-01.gif" width="29" height="93"></td>
    <td height="93" width="57"><a href="diary_iframe.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image77','','main/05-01-1.gif',1)" target="ham" onfocus='this.blur()'><img name="Image77" border="0" src="main/05-01.gif" width="57" height="93"></a></td>
    <td height="93" width="20"><img src="main/06-01.gif" width="20" height="93"></td>
    <td height="93" width="60"><a href="gallery_all.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image78','','main/07-01-1.gif',1)" target="ham" onfocus='this.blur()'><img name="Image78" border="0" src="main/07-01.gif" width="60" height="93"></a></td>
    <td height="93" width="39"><img src="main/08-01.gif" width="39" height="93"></td>
    <td height="93" width="56"><a href="photo_all_1.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image79','','main/09-01-1.gif',1)" target="ham" onfocus='this.blur()'><img name="Image79" border="0" src="main/09-01.gif" width="56" height="93"></a></td>
    <td height="93" width="9"><img src="main/10-01.gif" width="9" height="93"></td>
    <td height="93" width="109"><a href="collection_all.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image80','','main/11-01-1.gif',1)" target="ham" onfocus='this.blur()'><img name="Image80" border="0" src="main/11-01.gif" width="109" height="93"></a></td>
    <td height="93" width="33"><img src="main/12-01.gif" width="33" height="93"></td>
    <td height="93" width="66"><a href="guest2.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image74','','main/13-01-1.gif',1)" target="ham" onfocus='this.blur()'><img name="Image74" border="0" src="main/13-01.gif" width="66" height="93"></a></td>
    <td height="93" width="6"><img src="main/14-01.gif" width="6" height="93"></td>
    <td height="93" width="45"><a href="mailto:hamzz@dreamwiz.com" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image76','','main/15-01-1.gif',1)" onfocus='this.blur()'><img name="Image76" border="0" src="main/15-01.gif" width="45" height="93"></a></td>
    <td height="93" width="269"><img src="main/16-01.gif" width="269" height="93"></td>
  </tr>
  <tr align="left" valign="top">
    <td width="68" height="15"><img src="main/01-02.gif" width="68" height="25"></td>
    <td height="15" width="136"><a href="new.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image73','','main/02-02-1.gif',1)" target="ham" onfocus='this.blur()'><img name="Image73" border="0" src="main/02-02.gif" width="136" height="25"></a></td>
    <td height="25"><img src="main/03-02.gif" width="101" height="25"></td>
    <td height="25"><img src="main/04-02.gif" width="29" height="25"></td>
    <td height="25"><img src="main/05-02.gif" width="57" height="25"></td>
    <td height="25"><img src="main/06-02.gif" width="20" height="25"></td>
    <td height="25"><img src="main/07-02.gif" width="60" height="25"></td>
    <td height="25"><img src="main/08-02.gif" width="39" height="25"></td>
    <td height="25"><img src="main/09-02.gif" width="56" height="25"></td>
    <td height="25"><img src="main/10-02.gif" width="9" height="25"></td>
    <td height="25"><img src="main/11-02.gif" width="109" height="25"></td>
    <td height="25"><img src="main/12-02.gif" width="33" height="25"></td>
    <td height="25"><img src="main/13-02.gif" width="66" height="25"></td>
    <td height="25"><img src="main/14-02.gif" width="6" height="25"></td>
    <td width="45"><img src="main/15-02.gif" width="45" height="25"></td>
    <td height="15"><img src="main/16-02.gif" width="269" height="25"></td>
  </tr>
  <tr align="left" valign="top">
    <td width="68"><img src="main/01-03.gif" width="68" height="47"></td>
    <td width="136"><img src="main/02-03.gif" width="136" height="47"></td>
    <td width="101"><img src="main/03-03.gif" width="101" height="47"></td>
    <td colspan="11" rowspan="5" bgcolor="#FFFFFF"><iframe scrolling="auto" frameborder="0" width="484" height="432" src="new.htm" name="ham"></iframe></td>
    <td width="45"><img src="main/15-03.gif" width="45" height="47"></td>
    <td><img src="main/16-03.gif" width="269" height="47"></td>
  </tr>
  <tr align="left" valign="top">
    <td width="68"><img src="main/01-04.gif" width="68" height="207"></td>
    <td width="136"><a href="usa.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image81','','main/02-04-1.gif',1)" onfocus='this.blur()' target="ham"><img name="Image81" border="0" src="main/02-04.gif" width="136" height="207"></a></td>
    <td width="101"><img src="main/03-04.gif" width="101" height="207"></td>
    <td width="45"><img src="main/15-04.gif" width="45" height="207"></td>
    <td><img src="main/16-04.gif" width="269" height="207"></td>
  </tr>
  <tr align="left" valign="top">
    <td width="68"><img src="main/01-05.gif" width="68" height="73"></td>
    <td width="136"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image82','+ '','+ 'main/02-05-1.gif',1)" onfocus='this.blur()'><img name="Image82" border="0" src="main/02-05.gif" width="136" height="73"></a></td>
    <td width="101"><img src="main/03-05.gif" width="101" height="73"></td>
    <td width="45"><img src="main/15-05.gif" width="45" height="73"></td>
    <td><img src="main/16-05.gif" width="269" height="73"></td>
  </tr>
  <tr align="left" valign="top">
    <td width="68"><img src="main/01-06.gif" width="68" height="22"></td>
    <td width="136"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image83','','main/02-06-1.gif',1)" onfocus='this.blur()'><img name="Image83" border="0" src="main/02-06.gif" width="136" height="22"></a></td>
    <td width="101"><img src="main/03-06.gif" width="101" height="22"></td>
    <td width="45"><img src="main/15-06.gif" width="45" height="22"></td>
    <td><img src="main/16-06.gif" width="269" height="22"></td>
  </tr>
  <tr align="left" valign="top">
    <td width="68"><img src="main/01-07.gif" width="68" height="83"></td>
    <td width="136"><img src="main/02-07.gif" width="136" height="83"></td>
    <td width="101"><img src="main/03-07.gif" width="101" height="83"></td>
    <td width="45"><img src="main/15-07.gif" width="45" height="83"></td>
    <td><img src="main/16-07.gif" width="269" height="83"></td>
  </tr>
  <tr align="left" valign="top">
    <td width="68"><img src="main/01-08.gif" width="68" height="88"></td>
    <td width="136"><img src="main/02-08.gif" width="136" height="88"></td>
    <td><img src="main/03-08.gif" width="101" height="88"></td>
    <td><img src="main/04-08.gif" width="29" height="88"></td>
    <td><img src="main/05-08.gif" width="57" height="88"></td>
    <td><img src="main/06-08.gif" width="20" height="88"></td>
    <td><img src="main/07-08.gif" width="60" height="88"></td>
    <td><img src="main/08-08.gif" width="39" height="88"></td>
    <td><img src="main/09-08.gif" width="56" height="88"></td>
    <td><img src="main/10-08.gif" width="9" height="88"></td>
    <td><img src="main/11-08.gif" width="109" height="88"></td>
    <td><img src="main/12-08.gif" width="33" height="88"></td>
    <td><img src="main/13-08.gif" width="66" height="88"></td>
    <td><img src="main/14-08.gif" width="6" height="88"></td>
    <td><img src="main/15-08.gif" width="45" height="88"></td>
    <td><img src="main/16-08.gif" width="269" height="88"></td>
  </tr>
</table>
<embed src="http://www.toonzoo.co.kr/huru.asx" width="1" height="1" autoplay="true" hidden="true" loop="10">
</embed>
<script language="JavaScript">
<!-- fall Script by kurt.grigg@virgin.net

Amount=10;

Image0=new Image();
Image0.src="kissofgod01.gif";
Image1=new Image();
Image1.src="kissofgod02.gif";
Image2=new Image();
Image2.src="kissofgod03.gif";
Image3=new Image();
Image3.src="kissofgod04.gif";
Image4=new Image();
Image4.src="kissofgod05.gif";

grphcs=new Array(5)
grphcs[0]="kissofgod01.gif"
grphcs[1]="kissofgod02.gif"
grphcs[2]="kissofgod03.gif"
grphcs[3]="kissofgod04.gif"
grphcs[4]="kissofgod05.gif"

Ypos=new Array();
Xpos=new Array();
Speed=new Array();
Step=new Array();
Cstep=new Array();
ns=(document.layers)?1:0;
if (ns){
for (i = 0; i < Amount; i++){
var P=Math.floor(Math.random()*grphcs.length);
rndPic=grphcs[P];
document.write("<LAYER NAME='sn"+i+"' LEFT=0 TOP=0><img src="+rndPic+"></LAYER>");
}
}
else{
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i = 0; i < Amount; i++){
var P=Math.floor(Math.random()*grphcs.length);
rndPic=grphcs[P];
document.write('<img id="si" src="'+rndPic+'" style="position:absolute;top:0px;left:0px">');
}
document.write('</div></div>');
}
WinHeight=(document.layers)?window.innerHeight:window.document.body.clientHeight;
WinWidth=(document.layers)?window.innerWidth:window.document.body.clientWidth;
for (i=0; i < Amount; i++){
Ypos[i] = Math.round(Math.random()*WinHeight);
Xpos[i] = Math.round(Math.random()*WinWidth);
Speed[i]= Math.random()*3+2;
Cstep[i]=0;
Step[i]=Math.random()*0.1+0.05;
}
function fall(){
var WinHeight=(document.layers)?window.innerHeight:window.document.body.clientHeight;
var WinWidth=(document.layers)?window.innerWidth:window.document.body.clientWidth;
var hscrll=(document.layers)?window.pageYOffset:document.body.scrollTop;
var wscrll=(document.layers)?window.pageXOffset:document.body.scrollLeft;
for (i=0; i < Amount; i++){
sy = Speed[i]*Math.sin(90*Math.PI/180);
sx = Speed[i]*Math.cos(Cstep[i]);
Ypos[i]+=sy;
Xpos[i]+=sx;
if (Ypos[i] > WinHeight){
Ypos[i]=-60;
Xpos[i]=Math.round(Math.random()*WinWidth);
Speed[i]=Math.random()*5+2;
}
if (ns){
document.layers['sn'+i].left=Xpos[i];
document.layers['+ 'sn'+i].top=Ypos[i]+hscrll;
}
else{
si[i].style.pixelLeft=Xpos[i];
si[i].style.pixelTop=Ypos[i]+hscrll;
}
Cstep[i]+=Step[i];
}
setTimeout('fall()',60);
}
//-->
</script>

</body>
</html>



그런데, 아무리 소스를 봐도 모르겠어요 ㅜ.ㅜ

저는 오른쪽 왼쪽 프레임을 나눠서 지정한 프레임으로 가서 게시판이 열리거나, 그렇게 홈피를 만들었는데..

이 두분들은 가운데 네모난 박스안에서 모든 것이 다 되어 있네요.. 너무 아기자기 하고 이쁜 것 같아요..

그런데, 처음 드림위버를 사용할때 어떻게 저렇게 사이트를 꾸미는지 모르겠어요..

아...머리가 넘 복잡해요.. 답변좀 부탁드릴께요.. ㅜ.ㅜ

만약에 내용이 방대하거나 하면 제 메일로도라도 부탁드릴께요..

elika1004@hanmail.net
이 게시물을
좋아요
목록
글쓴이 제목 최종 글
XE 공지 글 쓰기,삭제 운영방식 변경 공지 [16] 2019.03.05 by 남기남
carrot phpmail 설치 방법좀 갈켜주세요.. [1] 2007.08.10
크레이지 아이 프레임 안에 셀렉트 박스 폼을 집어 넣을수 있나요? [1] 2007.08.10
박현진 홈페이지 만들때요, 이런 방식은 어떻게 하는지 고수님들의 답변부탁드릴게요.. [2] 2007.08.10
오지영 간단한질문하나... [3] 2007.08.10
인천사람 이미지레디/롤오버적용시.. [1] 2007.08.10
cherop www <--를 붙여서 쓰고 싶습니다.? [1] 2007.08.10
신재민 _parent 타켓이 제대로 안됩니다. [1] 2007.08.10
김성수 포토샵에서 폰트 메뉴중 [1] 2007.08.10
김성수 아래 포토샾 메뉴와 관련하여 추가 질문드립니다. [1] 2007.08.10
박희정 아이프레임안에 게시판불러올때요..~ [1] 2007.08.10
윙 [질문및 요청입니다.] 스크롤바를 따라다니는 메뉴... [1] 2007.08.10
문성은 팝업창 소스를 이렇게 해 띄웠는데...ㅜ.ㅜ [2] 2007.08.10
CityBoys-Life 플래시 메뉴? [1] 2007.08.10
stonefree 음악관련 홈페이지 질문 [2] 2007.08.10
민종식 드림위버 실행후 코드보기를 실행하면??? [1] 2007.08.10
윤주호 이미지 리사이징에 대해서  
김민경 <일러스트>작업한 이미지가 있는데 이것에 전체적으로 입체감을 주고 싶습니다. [1] 2007.08.10
노지원 플래시에서 PNG파일을 사용하는 문제... [2] 2007.08.10
문희열 이미지맵... [4] 2007.08.10
beMax IFRAME 관련 : 아이프레임이 로드한 파일 주소 알려면? [2] 2007.08.10
andrew 백업 받은 데이타 어떻게 밀어 넣을 수 있나여?  
.시휘랑. 계정 옮길때요. [1] 2007.08.10
박희정 게시판은 제자리에 와있는데..링크가 안돼요..  
민종식 테이블을 점선으로 바꾸는 방법좀^^ [2] 2007.08.10
m i k i 웹폰트를 썼는데 아무것도 안보인데요 [1] 2007.08.10
에뜨랑제 웹폰트로 된 문서를 프린트 할때... 폰트가 깨지는 문제....  
사공희 새창띄우는 홈페이지 만들때 [4] 2007.08.10
Michelle mysql에 unicode문자를 입력하려면 어떻게 해야하죠... [2] 2007.08.10
발바리 질문이여... [1] 2007.08.10
구염이 (알려주세요)다운받은 책 목록 보여주는 방법  
태그 쓰기