묻고답하기

  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 남기남
kyoi 크림리스 창에대한 질문입니다// file  
조철희 질문인데요...... [4] 2007.08.10
ppond03 노프레임 사이트를 만들었는데.... 급합니다. [2] 2007.08.10
미자 nl2br 이 공백에서는 안먹네요.. [2] 2007.08.10
김종엽 배경음악을 처음곡은 랜덤 나머지는 순차적으로 재생하는 법좀 알려주세요~  
김형철 줄바꿈시 선을 넣고 싶습니다..  
김은혜 [게시판 문의] 테두리 넣어주는것 [3] 2007.08.10
SJH 이젠 이런게 떠요 -_-;; [1] 2007.08.10
하얀두부 외부로그인 관련 질문.. [1] 2007.08.10
이태운 노프레임에서요 냉유 필독 [1] 2007.08.10
레드 나모에서 문서 작성하고 저장하면.. [1] 2007.08.10
뽀샤샤노랑머리 플래시에서 노래 넣을때.. [2] 2007.08.10
꺄르르 제로보드에서 게시판에 글쓰면 회원들 점수올라가는거요.. (질문) [1] 2007.08.10
exwoo 나모, 링크 걸린 메뉴를 누르면 주위에 점선 박스가 생깁니다. [1] 2007.08.10
허준 [질문]크롬리스창으로 새창띄우니까 이미지가 멈춰버립니다...  
체리★ 폴더를 실수로 숨기기를 체크해 버렸거든요. [2] 2007.08.10
이병관 iframe에서의 스크롤바 색상 변경에 대하여.. [1] 2007.08.10
박선영 이..이런경우도 있나요? [2] 2007.08.10
rubin 새창띄우는거요.ㅠ_- [1] 2007.08.10
이명훈 스크롤바 이미지 변경과 마우스 오버에 관한 질문인데요.  
태그 쓰기