테스트 사이트 - 개발 중인 베타 버전입니다
SIR

그림클릭시 레이어 띄우기

CLUB
프로필 보기이 회원 글보기이 회원의 댓글보기
 · 18년 전 · 2327
<HTML>
<HEAD>
<TITLE>코리아인터넷닷컴 자바스크립트 소스/예제 모음</TITLE>
</head>

<body bgcolor="#FFFFFF" text="#000000" link="#000000" onload="initthumb();" alink="#000000" vlink="#000000" >
<p><center><font color="white"><b>▶ </b></font>
<a href="http://korea.internet.com/channel/index.asp?cid=189"><b>코리아인터넷닷컴 자바스크립트 소스/예제 모음</b></a></center><p>
<br><br>

<script language="javascript">
// 아직 레이어는 생성되지 않았다.
var trigger=0
// 아직 활성화된 레이어는 없다.
var vis=0
function initthumb()
{
document.onmousemove = sniff
document.onmouseup = sniff
document.onmousedown = sniff
// Trigger Netscape Mouse Check
if (document.layers){document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP)}
// Call dummy to help IE get width + height
if (document.all)dopic('dummy','',1,1,1,1)
}
function sniff(e){
// 마우스의 위치정보를 얻는 부분
if (document.layers) {var mousex=e.pageX; var mousey=e.pageY;fx=mousex;fy=mousey;}
else if (document.all) {var mousex=event.x; var mousey=event.y+document.body.scrollTop;fx=mousex;fy=mousey}
}
function dopic(name,auto,picx,picy)
{
if (vis == 0) // 활성화된 레이어가 없다면..
{
// 기본값
var oldpicx=100;
var oldpicy=100;
var rahmen='silver'
var alttext="클릭하면 사진이 사라집니다."

// 레이어가 없을 때
if (trigger!=1)
{
trigger=1 // 레이어를 생성해 준다.
// 숨겨진 레이어를 만든다(Netscape)
if(document.layers){
document.layers['picarea'] = new Layer(1);
document.layers['picarea'].left = oldpicx;
document.layers['picarea'].top = oldpicy;
document.layers['picarea'].height = 20;
document.layers['picarea'].visibility = "hidden";
}
// 숨겨진 레이어를 만든다(IE)
else if (document.all){
document.body.insertAdjacentHTML("BeforeEnd",'<DIV ID="picarea" STYLE="z-index:200;position:absolute;left:"+picx+";top:"+picy></DIV>');
}
}

// 만약에 레이어가 있다면, 숨겨준다.
if (trigger != 0){
if (document.layers){document.layers['picarea'].visibility="hide"} //Netscape
if (document.all){picarea.style.visibility="hidden"}
}
// 레이어의 내용을 정해주는 부분
content="<a href=\"javascript:clearpic()\" style=\"color:"+rahmen+"\"><img src=\"http://korea.internet.com/images/javascript/";
content=content+name+"\" name=\"pic\" alt=\""+alttext+"\" border=1";
content=content+"></A>";
// 레이어 안에 정해준 내용을 넣고, 보여주는 부분(Netscape)
if (document.layers) {
sprite=document.layers['picarea'].document;
sprite.open();
sprite.write(content);
sprite.close();
// 위치가 자동적으로 지정되지 않을 때, 레이어를 처음에 정해주었던 기본 위치에 위치시킨다.
if (picx != null && auto == ''){
document.layers['picarea'].left = picx;
document.layers['picarea'].top = picy;
}
// 위치가 자동적으로 지정되게 되어있으면..
if (auto != "")
{
// 사진의 폭과 높이를 얻는부분
xw=document.layers['picarea'].document.images['pic'].width
yw=document.layers['picarea'].document.images['pic'].height
// 사진의 중심부분의 위치를 새롭게 마우스의 위치로 설정한다.
newpicx = fx - (xw/2)
newpicy = fy - (yw/2)
// 오프셋이 있다면, 그것도 맞춰서 설정해 준다.
if (picx) {newpicx=newpicx + picx}
if (picy) {newpicy=newpicy + picy}
// 레이어의 위치를 설정해 준다.
document.layers['picarea'].left = newpicx;
document.layers['picarea'].top = newpicy;
}
// 레이어를 보여준다.
document.layers['picarea'].visibility="show";
// 활성화된 레이어가 있다고 바꿔준다.
vis=1
}

// 레이어 안에 정해준 내용을 넣고, 보여주는 부분(IE)
if (document.all) {
document.all['picarea'].innerHTML = content;
// 위치가 자동적으로 지정되지 않을 때, 레이어를 처음에 정해주었던 기본 위치에 위치시킨다.
if (picx != null && auto == ''){
picarea.style.top=picy
picarea.style.left=picx;
}
// 위치가 자동적으로 지정되게 되어있으면..
if (auto != "") {
// get the picture width/height
xw=document.all['pic'].width
yw=document.all['pic'].height
// 사진의 중심부분의 위치를 새롭게 마우스의 위치로 설정한다.
newpicx = fx - (xw/2)
newpicy = fy - (yw/2)
// 오프셋이 있다면, 그것도 맞춰서 설정해 준다.
if (picx) {newpicx=newpicx + picx}
if (picy) {newpicy=newpicy + picy}
// 레이어의 위치를 설정해 준다.
picarea.style.top=newpicy;
picarea.style.left=newpicx;
}
// 레이어를 보여준다.
// 만약에 이름이 정해져 있다면..
if (name != "dummy") {
picarea.style.visibility="visible";
// 활성화된 레이어가 있다고 바꿔준다.
vis=1
}
}
else if (document.layers == null && document.all == null) {self.location=name};
}
}
// 클릭하면 레이어를 숨겨주는 부분
function clearpic() {
// 보여진 레이어를 비활성화 시키는 부분
vis=0
if (document.layers){document.layers['picarea'].visibility="hide"};
if (document.all){picarea.style.visibility="hidden"};
}
//-->
</SCRIPT>
<table width="100%" height="100%">
<tr align="left">
<td colspan="2">
<script language="Javascript"><!--
var d=new Date();var r=(d.getTime()%8673806982)+Math.random();var uu=escape(window.location.href);
var wh='" width="728" height="90" ';var host='.casalemedia.com/';var dc=document;
var fr='marginwidth="0" hspace="0" vspace="0" frameborder="0" scrolling="no">';
dc.write('<ifr');
dc.write('<a hr');
dc.write('<i');
//--></script>
</td>
<td></td>
</tr>
<tr valign="top">
<td align="left" style="padding:10 0 0 100">
<CENTER>

<font face="arial" size=2><BR><BR><B>사진을 클릭해 보세요.</B><BR>크게 나타난 사진을 클릭하시면 사진이 사라집니다.<BR><BR>
위치 지정 : 자동 , 가로 오프셋 : 0 , 세로 오프셋 : 0 <br>
<a href="javascript:dopic('kic_hp.jpg',1, 0,0)"><IMG SRC="http://korea.internet.com/images/javascript/kic_hp.jpg" WIDTH=96 HEIGHT=72 ALT="" BORDER="0"></A><BR><BR>
위치 지정 : 자동 , 가로 오프셋 : 100 , 세로 오프셋 : 100 <br>
<a href="javascript:dopic('kic_hp.jpg',1, 100,100)"><IMG SRC="http://korea.internet.com/images/javascript/kic_hp.jpg" WIDTH=96 HEIGHT=72 ALT="" BORDER="0"></A><BR><BR>
위치 지정 : 수동 , 가로 오프셋 : 0 , 세로 오프셋 : 0 <br>
<a href="javascript:dopic('kic_hp.jpg',0, 0,0)"><IMG SRC="http://korea.internet.com/images/javascript/kic_hp.jpg" WIDTH=96 HEIGHT=72 ALT="" BORDER="0"></A><BR><BR>
위치 지정 : 수동 , 가로 오프셋 : 300 , 세로 오프셋 : 0 <br>
<a href="javascript:dopic('kic_hp.jpg',0, 300,0)"><IMG SRC="http://korea.internet.com/images/javascript/kic_hp.jpg" WIDTH=96 HEIGHT=72 ALT="" BORDER="0"></A><BR><BR>
위치 지정 : 수동 , 가로 오프셋 : 0 , 세로 오프셋 : 500 <br>
<a href="javascript:dopic('kic_hp.jpg',0, 0,500)"><IMG SRC="http://korea.internet.com/images/javascript/kic_hp.jpg" WIDTH=96 HEIGHT=72 ALT="" BORDER="0"></A>
</FONT>
</CENTER>
<BR><BR>
</td>
<td align="right" style="padding:10">
</td>
<td></td>
</tr>
<tr align="left">
<td colspan="2">
</td>
<td></td>
</tr>
</table>
<br><br>
</body>
</html><div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 16:57:14 JavaScript에서 이동 됨]</div>
목록
이전글 다음글

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

게시글 목록

번호 제목
11111
기타 이미지 저작권 관련 설명 4탄 1
11108
기타 이미지 저작권 관련 설명 3탄 2
11107
기타 이미지 저작권 관련 설명 2탄
11105
JavaScript 이미지 저작권 관련 설명 1탄 1
11101
Flash 초간단 플래시테두리 없애는 방법입니다. 3
11099
JavaScript 직접만든 자바스크립트 Trim 함수입니다. 1
11095
PHP exif 익스텐션 실행이 안되는 경우 3
11093
기타 선택하면 입력폼에 자동입력 기능 질문입니다 1
24843
이력서양식입니다 2
11065
PHP [입문자용 강좌] 함수 1 27
11063
기타 Ajax을 이용한 채팅 입니다. 1
11059
JavaScript PHP Ajax 프레임워크 3
29001
HTML [입문자용 강좌]제어구조 (if, else if, else) 18
11054
JavaScript 일반PC로 서버 만들경우.... 4
28999
HTML Prototype 1.5.0 Document 1
11050
Flash 글자 나눠서 현재 위치에 레이어 별로 분산하기... 3
28998
HTML mshtml.dll error 발생시
28956
HTML [입문자용 강좌]연산자란? 꼭 숙지!!!! 41
11044
PHP [입문자용 강좌] 미리 정의된 아주 유용한 상수 5
11023
JavaScript [입문자용 강좌] 상수? 20
11004
기타 [입문자용 강좌] 변수형? 18
28946
HTML [입문자용강좌] 변수란? 9
10993
PHP [입문자용강좌] 페이지내에서 php 사용하기 10
10990
기타 div에도 style='TABLE-layout:fixed' 같은 기능 없나요? 2
28903
HTML php 어떻게 하면 잘 할수 있는가? 42
10984
기타 폼입력시 한글자동입력 스타일 적용 5
24842
계약서 고용계약서
28900
HTML marquee 태그 활용법 2
10982
기타 iframe-사이즈 자동 조절 1
10978
JavaScript 실제 이미지 크기 알아내기 3
28899
HTML 4.0이상의 PHP에서 register_globals 문제
10974
Flash 플래쉬 투명바탕 어떻게 하는거죠? 3
10970
기타 CSS 와 DIV만을 이용해 화면 중앙(수직, 수평모두)에 내용 정렬하기 3
24831
기획서 홈페이지 제작기획서, 계약서 [http://designsian.com] 10
24830
계약서 표준임대차 계약서
10967
JavaScript ie,firefox alpha값 2
10965
MySQL mssql에서 구분자를 넣는 txt파일로 저장하여 mysql에서 load data infile 로 넣는다 1
10963
MySQL MySQL Dump뜨는 방법 및 복구 방법 1
10956
JavaScript 왕초보 소스 중 질문있어요...^^; 6
10954
Flash 플래시 그림판 소스 입니다. 1
10950
Flash [펌]겔러리에 적용하면 괜찮은 소스 3
10946
기타 플래쉬로 사진몇장 연속해서 보여주기 어&#45935;게 하나요? 3
24818
견적서 홈페이지 견적서입니다 11
10943
Flash 플래시 활성화 영역 안나오게 하기... 2
28885
JavaScript 외부의 이미지를 자신의 서버경로에 썸네일 만드는 방법 13
24813
쇼핑몰 계획서 4
10940
Flash 플래시 버튼에서 자바 스크립트로 새창열때~ 2
10927
JavaScript 포토샵질문드려요. 12
10925
Flash FLEX 참고자료 URL 1
10920
JavaScript 이동도구(v)팁 4
10916
기타 div 레이아웃 예제. 깔끔하고 편리하게 정리된곳. 3
10914
PHP DHTML 에디터를 정리해 놓은 사이트 입니다. 1
10913
기타 FLEX 란?
10908
Flash 플래시 플레이어 오류발생할 때 패치 4
10905
PHP 타겟(target) 쓰는 법 2
10904
Flash 패치문제 하나의 js파일만 만들고 여러개의 플래쉬무비 해결하는 방법 (4) -보충
10899
기타 마우스 포인터가 열십자(+) 모양일 때 4
24803
2007년 달력 월간계획표 [엑셀] 9
28882
HTML 링크클릭시 나타나는 점선 없애주기 2
10898
Flash 간단한 퀵메뉴
28878
기타 Ajax 마스터하기 3
28877
HTML [펌] php로 쉘에서 사용자입력 및 인자(인수)값 넘겨받기
24802
오픈 소스와 오픈 비지니스
24801
오픈 소스 경제학
24800
e-비지니스 산업연구
24799
IT 산업 분류체계
10893
기타 툴바 뒤로 파일이 자꾸 숨어버립니다. 4
10892
기타 form객체내 select 항목의 이름이 s_date[2] 와 같이 배열명으로 되어 있으면?
24797
크로싱 브라우저 관련 1
24794
마케팅 입소문 마케팅 연구분석 리포트 2
10891
Flash 정상적인 사운드가 빠르게 재생될때
28871
HTML id와 class의 차이점? 5
28870
HTML 이미지 갤러리 - 전 웹진으로 사용하려고요
10881
MySQL 평가 표시 ★☆로 할 때 9
10872
MySQL 디렉토리 생성 허용하는 웹호스팅 아시는 분..? 8
10870
PHP [정보] Css 관련 싸이트들 1
28868
HTML 오른쪽 마우스 금지 스크립트 입니다.드레그해서 사용해보세요. 1
10868
JavaScript 3D 회전식 메뉴입니다. 드레그해서 붙혀서 사용해보세요 1
10866
MySQL mysql 사용중에 가장 많이 사용하는 명령어 정리입니다. 1
28862
HTML Ajax로 만든 쇼핑몰입니다. 5
10864
기타 랜덤백그라운드 1
28861
HTML 마소 컬러 선택 대화상자
10863
기타 회원에게만 보여준다
28860
HTML KOSDAQ소스
10862
JavaScript ZDNet Korea레이어
28859
HTML String 을 UTF8 encoding 하기
28858
HTML SHIFT, CTRL, ALT 키를 막는 방법
10861
JavaScript present[다음에서 발췌]
10859
기타 항상중심에레이어띄우기 1
28856
HTML 클릭한 메뉴 고정하기 1
10857
JavaScript 클릭시 화면이 위로 올라가는 현상 막아주기 1
28854
HTML 체크한 것만 합계를 표시하는 스크립트 1
10856
기타 쿠키1년간체크
28853
HTML 자막파일(.smi) 싱크밀고 당기기
28852
JavaScript 일정시간동안 이미지 자동으로 변경하기
28851
HTML 이미지 파일 에러 처리
10855
JavaScript 이미지 미리 로딩시켜놓기
28850
HTML 웹로봇 배제 표준
10854
기타 우측하단 메신저형식의 레이어광고
28849
HTML 아이프레임하나만 새로고침하기
이전 다음
전체 목록