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

그림클릭시 레이어 띄우기

CLUB
프로필 보기이 회원 글보기
 · 18년 전 · 2323
<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>
목록
이전글 다음글

댓글 작성

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

로그인하기

게시글 목록

번호 제목
24900
계약서 업무제휴계약서_인터넷
24899
업무계획서_영업
24898
양해각서_계약
24897
시말서_노무
24896
견적서 수의계약 견적서_공사관리
24895
송장_무역
24894
손해배상합의서_민사법률
24893
세금계산서_부가가치세
24892
사직원_기업일반
24891
사직서_기업일반
24890
사유서_총무
24889
사용인감계_영업
24888
사업계획서_창업
24887
사업계획서 작성요령_창업
24886
사업계획서2_창업
11687
JavaScript 일러스트 미리보기 툴을 찾으시는 분들께.. 4
24885
계약서 부동산 매매계약서
24884
발주서_기업일반
24883
물품인수증_기업일반
24882
계약서 물품매매계약서_계약
24881
계약서 물품구매 표준계약서_구매
24879
물품관리및출납표_구매 1
24878
문서발송대장_인사
24877
견적서 무역 영문견적서_회사
24875
기획서 마케팅 기획서_기업일반 1
24874
계약서 동업계약서샘플_일반계약
24873
계약서 대리점 계약서_일반계약
24872
내용증명-부동산매매계약해지_부동산
24871
기획일보_기타
11683
기타 홈피가 않열립니다.(fedora5로 셋팅) 3
11662
Flash 그누보드용 플래시 최근게시물 20
11659
기타 인물 사진 보정하기 2
29136
HTML 레이어의 중심점 찾기, 작업문서의 중심점 찾기 1
11647
JavaScript 왼쪽에 달면 좋을만한 소스 11
11644
기타 사진가장 자리를 말아 올린 효과.. 2
11641
JavaScript 최적의 해상도 설정법 2
11634
기타 Adobe bridge CS3에서... 6
11632
Flash Flash CS3 에서의 인스턴스네이밍 문제... 1
29135
HTML 부모 id class를 적용하여 같은 이름의 class에 다른 스타일 부여.
11631
JavaScript 1px 라인 css와 2개이상 class 적용.
11628
기타 사각 마퀴 툴에서 원형 마퀴 툴을 단축키로 바꾸게 하기 2
24870
기안서_기안용지_총무
24869
계약서 기술제휴계약서_영업
24868
급여명세서대장_총무
24867
급여명세서_기업일반
24866
급여대장_총무
24865
계약서 근로계약서_기업일반
24864
계약서 공증 채무승인계약서_채권
24863
공문_행정
24862
계약서 고용계약서_총무
24861
고발고소장_민원
24860
계약서 계약서_부동산
11627
기타 vim 환경설정 .vimrc
24859
경력증명원_인사
24858
경력증명서_기업일반
24856
견적서 견적서_일반기업 1
24855
계약서 건설공사 하도급 계약서_건설업법
24854
거래약정서_일반계약용입니다
24853
거래명세표입니다
24852
각서_부동산용입니다
29130
HTML 퀵마스크의 활용 예제 4
11625
JavaScript 익스플로러7 팝업창의 주소창 없애기 1
11622
기타 요즘 많이 쓰이는 텍스쳐들.. 골드 텍스쳐 2
11617
기타 깨진 스틸질감 블록 만들기.. 4
11604
기타 300 DPI로 화면캡쳐 하기 12
11596
기타 반짝이는 버튼 만들기 7
11591
기타 그라이언트설정으로 금속재질 문자 만들기 4
11586
기타 포토샵 강좌ː눈물을 그려넣어보자 4
29128
HTML 외부필터 설치하기 1
11583
기타 포토샵 CS단축키.. PDF파일입니다. 2
11579
기타 [펌] Apache의 P3P 관련 헤더 설정 3
11578
PHP PHP Eclipse - apm에서debugger까지 한방에
11574
MySQL MySQL 한글 매뉴얼 3
11566
Flash swf파일에 링크 걸려면?? 7
11565
Flash [질문]exe파일로 된 플래시 파일 웹에 올리는 법 아시는 분~~
11562
JavaScript levels, Curves, Hue/Saturation..등 이전에 사용된 설정값 그대로 사용하기 2
11561
MySQL PHP 5.2.0 설치시 MySQL 문제
29125
HTML 움직이는 사진에 효과 넣을때 2
11558
기타 필름효과내기 2
11556
JavaScript 한글폰트가 안 보일때... 1
11533
Flash 국내지도 소스입니다. 22
11529
JavaScript 회전목마 - 스크롤링 소스 3
29118
HTML 포토샵 효과 모음2 6
11526
기타 포토샵 효과 모음 2
11519
JavaScript [팁] 물방울 효과2 6
29115
HTML [팁] 물방울 효과 2
11518
MySQL official 64bit mysql
11516
PHP 64비트 php - unofficial 1
11515
기타 서버내 일정 용량 넘는 파일 찾아내기
11509
JavaScript CS2에서 포토샵 PSD파일과 일러스트 AI파일 미리보기 기능 5
11508
기타 Javascript 사전입니다.
29112
HTML HTML 사전입니다. 2
11496
기타 PHP 사전입니다. 11
29109
HTML 링크 걸린 문자와 이미지에 점선 테두리 생기는 것 2
29106
HTML 하루동안만 안열리는 새창 만드는소스 2
11495
PHP $_FILES['user_file']['error']에 대한 에러코드
11488
JavaScript Ajax가 뭐죠? 6
11486
기타 사이트를 utf8으로 열기 1
11483
기타 PHP Debugger for dreamweaver 2
11471
기타 CSS 레이아웃 기초 - 완성형 예제 11
이전 다음
전체 목록