글로 쓰면 좀 어렵지요
첨부파일로 파워포인트로 해서 만들어 봤어요 참조하세요 드림위버 혹은 나모를 이용해 작업하시면 됩니다. (기본지식이 있는 분이면.. 가능하시리라 생각됩니다.)다른거 없이 딱 소스에 대해서만 설명해 드리겠습니다.
1. 자 드림위버나 나모를 여세요.
2. 아래 보여지는 소스가 새창띄우기 소스 입니다.. 짧죠.. 저 5줄만.. 확실히 아시면 새창 쉽게 띄웁니당 ^^
<img onmouseover="this.src='01_over.jpg'"
style="CURSOR: hand"
onclick="window.open('01.html','_blank','width=840,height=700,scrollbars=yes');"
onmouseout="this.src='01.jpg'"
src="01.jpg" border="0" />
3. 자 이제 본격적으로 소스에 대해 설명 들어 가겠습니당.
완성된 소스로 설명 드릴께요...<참조> 저는 이미지호스팅을 카페24를 이용합니다.<img onmouseover="this.src='http://psg.imghost.cafe24.com/020 pants/001 main/pt2001-b.jpg'" (위에소스설명 'http://psg.imghost.cafe24.com/020 pants/001 main/pt2001-b.jpg' 이넘이 마우스를 가져가면 "클릭하세요"라는 이미지가 보여지는 소스입니다. 이미지 "클릭하세요"라는게 만들기 귀찮으면 onmouseover과 onmouseout 독같은것 넣우면 되여style="CURSOR: hand" (위에소스설명 커서핸드라고 되어있죵... 이미지에 마우스를 가져가면 손모양으로 변하게 해주는 소스입니다. ^^)onclick="window.open('http://psg1020.imghost.cafe24.com/020 pants/001 main/pt2001.htm','_blank','width=820,height=20000,scrollbars=yes');" (위에소스설명 이넘이 중요합니다. pt2001.htm 이넘이 클릭했을때 새창으로 보여지는 파일이름입니다._blank 는 새창으로 띄우라는 뜻입니다.
scrollbars=yes 로 해놓으시면.. 이미지사이즈가 창크기보다 크면 자동으로 스크롤바가 생깁니다.
no 를 하면 절대네버~~ 스크롤바가 안생깁니다.
'width=820,height=20000 이라는 건 새창의 가로사이즈와 / 세로사이즈를 의미합니다.
여기서 의문점? 그럼 pt2001.htm은 무엇인가요..?
상세페이지입니다. 만드신 상세페이지를 이미지 저장후 드림위버나/나모에서 pt2001.html로 저장하시고.
꼭~ 같은 폴더안에 넣어놔 주세요..
그리고 각자 쓰시는 호스팅 업체에 넣으시면 되요.....onmouseout="this.src='http://psg1020.imghost.cafe24.com/020 pants/001 main/pt2001.jpg'" 이넘이 마우스를 아웃했을때 보여지는 이미지입니당 src="http://psg1020.imghost.cafe24.com/020 pants/001 main/pt2001.jpg" border="0" />
(위에소스설명 01.jpg 이넘은 기본이미지 경로입니다. )
<!-- 새창띄우기 -->
--------------------------------------------------------------------
이상은 G마켓에 새창 띄우기 이고요
다음은 11번가나 옥션에서 새창 띄우기 인데....
이렇게 만든 html을 한번더 묶습니다.
뭐 소리인가 하면....
예를 들어 제가 작성한 것인데
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<title>제목 없음</title>
<meta name="generator" content="Namo WebEditor v6.0">
</head>
<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red">
<table border="0">
<tr>
<td width="943"> <p>
<img onmouseover="this.src='http://psg1020.imghost.cafe24.com/012 casual ops/001 main/op2012.jpg'"
style="CURSOR: hand"
onclick="window.open('http://psg1020.imghost.cafe24.com/012 casual ops/001 main/op2012.htm','_blank','width=800,height=30000,scrollbars=yes');"
onmouseout="this.src='http://psg1020.imghost.cafe24.com/012 casual ops/001 main/op2012.jpg'"
src="http://psg1020.imghost.cafe24.com/012 casual ops/001 main/op2012.jpg" border="0" />
</p>
</td>
</tr>
</table>
<p> </p>
</body>
</html>
이렇게 하면 지마켓용이고 이것을 예를 들러 001.html로 저장하시고 이 html을 자신이
시용하시는 호스팅용 FTP에 올립니다(사진 올리듯이)
그리고 iframe을 이용하여 다시한번 html을 만들어 줍니다..
예제
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<title> </title>
<meta name="generator" content="Namo WebEditor v6.0">
</head>
<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red">
<iframe src=" http://psg1020.imghost.cafe24.com/001.html" frameborder=0 width="820" height="10000">
</iframe>
</body>
</html>
위에 001.html을 iframe를 써서 다시한번 입혀주시면 우회에서 통째로 보여지게 되며
예제를 11번가나 옥셩에 복사해서 붙여주시면 되는거에요....
그리고 스크롤이 생기는 것은 width, height 조절 하시면 됩니다.
첨에는 뭐소리인가 저두 헷갈렸는데 알고 보면 간단할 수 도 있어여....
모두 대박나시고여 부자 되세요 (저두 부자 되고 싶다..흑흑 왜이리 안팔릴까...ㅠㅠ)
/옮긴 글
