<html>
<head>
<title>http://siteweb.co.kr/</title>
<script language="javascript">
<!--
function slide(Id, interval, to) {
var obj = document.getElementById(Id);
var H, step = 5;
if (obj == null) return;
if (to == undefined) { // user clicking
if (obj._slideStart == true) return;
if (obj._expand == true) {
to = 0;
obj.style.overflow = "hidden";
} else {
slide.addId(Id);
for(var i=0; i < slide.objects.length; i++) {
if (slide.objects[i].id != Id && slide.objects[i]._expand == true) {
slide(slide.objects[i].id);
}
}
obj.style.height = "";
obj.style.overflow = "";
obj.style.display = "block";
to = obj.offsetHeight; // 이거이거
obj.style.overflow = "hidden";
obj.style.height = "1px";
}
obj._slideStart = true;
}
step = ((to > 0) ? 1:-1) * step;
interval = ((interval==undefined)?1:interval);
obj.style.height = (H=((H=(isNaN(H=parseInt(obj.style.height))?0:H))+step<0)?0:H+step)+"px";
if (H <= 0) {
obj.style.display = "none";
obj.style.overflow = "hidden";
obj._expand = false;
obj._slideStart = false;
} else if (to > 0 && H >= to) {
obj.style.display = "block";
obj.style.overflow = "visible";
obj.style.height = H + "px";
obj._expand = true;
obj._slideStart = false;
} else {
setTimeout("slide('"+Id+"' , "+interval+", "+to+");", interval);
}
}
slide.objects = new Array();
slide.addId = function(Id)
{
for (var i=0; i < slide.objects.length; i++) {
if (slide.objects[i].id == Id) return true;
}
slide.objects[slide.objects.length] = document.getElementById(Id);
}
//-->
</script>
<style>
.menu {
border:1px solid #999999;
background-color:#FFCC00;
padding:3px 1px 1px 5px;
cursor:hand;
width:150px;
}
.submenu {
width:150px;
padding-left:10px;
display:none;
}
</style>
</head>
<body>
<div class="menu" onClick="slide('sub1');">메뉴항목 1</div>
<div id="sub1" class="submenu">
<div>- Sub menu 1-1</div>
<div>- Sub menu 1-2</div>
<div>- Sub menu 1-3</div>
<div>- Sub menu 1-4</div>
<div>- Sub menu 1-5</div>
</div>
<div class="menu" onClick="slide('sub2');">메뉴항목 2</div>
<div id="sub2" class="submenu">
<div>- Sub menu 2-1</div>
<div>- Sub menu 2-2</div>
<div>- Sub menu 2-3</div>
<div>- Sub menu 2-4</div>
<div>- Sub menu 2-5</div>
<div>- Sub menu 2-6</div>
<div>- Sub menu 2-7</div>
<div>- Sub menu 2-8</div>
</div>
<div class="menu" onClick="slide('sub3');">메뉴항목 3</div>
<div id="sub3" class="submenu">
<div>- Sub menu 3-1</div>
<div>- Sub menu 3-2</div>
<div>- Sub menu 3-3</div>
</div>
<div class="menu" onClick="slide('sub4');">메뉴항목 4</div>
<div id="sub4" class="submenu">
<div>- Sub menu 4-1</div>
<div>- Sub menu 4-2</div>
<div>- Sub menu 4-3</div>
</div>
<div class="menu" onClick="slide('sub5');">메뉴항목 5</div>
<div id="sub5" class="submenu">
<div>- Sub menu 5-1</div>
<div>- Sub menu 5-2</div>
<div>- Sub menu 5-3</div>
<div>- Sub menu 5-4</div>
</div>
</body>
</html>
위는 기존에 "[HTML] 부드럽게 서브메뉴가 슬라이딩 되는 펼침메뉴" 입니다. 여기서 제가 링크1에 사진을 첨부헀는데
이런 링크를 이용하여 서브메뉴 클릭시 팝업창에 사진이 나오게 하고 싶습니다.
가르쳐 주세요.<div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 16:57:14 JavaScript에서 이동 됨]</div>
<head>
<title>http://siteweb.co.kr/</title>
<script language="javascript">
<!--
function slide(Id, interval, to) {
var obj = document.getElementById(Id);
var H, step = 5;
if (obj == null) return;
if (to == undefined) { // user clicking
if (obj._slideStart == true) return;
if (obj._expand == true) {
to = 0;
obj.style.overflow = "hidden";
} else {
slide.addId(Id);
for(var i=0; i < slide.objects.length; i++) {
if (slide.objects[i].id != Id && slide.objects[i]._expand == true) {
slide(slide.objects[i].id);
}
}
obj.style.height = "";
obj.style.overflow = "";
obj.style.display = "block";
to = obj.offsetHeight; // 이거이거
obj.style.overflow = "hidden";
obj.style.height = "1px";
}
obj._slideStart = true;
}
step = ((to > 0) ? 1:-1) * step;
interval = ((interval==undefined)?1:interval);
obj.style.height = (H=((H=(isNaN(H=parseInt(obj.style.height))?0:H))+step<0)?0:H+step)+"px";
if (H <= 0) {
obj.style.display = "none";
obj.style.overflow = "hidden";
obj._expand = false;
obj._slideStart = false;
} else if (to > 0 && H >= to) {
obj.style.display = "block";
obj.style.overflow = "visible";
obj.style.height = H + "px";
obj._expand = true;
obj._slideStart = false;
} else {
setTimeout("slide('"+Id+"' , "+interval+", "+to+");", interval);
}
}
slide.objects = new Array();
slide.addId = function(Id)
{
for (var i=0; i < slide.objects.length; i++) {
if (slide.objects[i].id == Id) return true;
}
slide.objects[slide.objects.length] = document.getElementById(Id);
}
//-->
</script>
<style>
.menu {
border:1px solid #999999;
background-color:#FFCC00;
padding:3px 1px 1px 5px;
cursor:hand;
width:150px;
}
.submenu {
width:150px;
padding-left:10px;
display:none;
}
</style>
</head>
<body>
<div class="menu" onClick="slide('sub1');">메뉴항목 1</div>
<div id="sub1" class="submenu">
<div>- Sub menu 1-1</div>
<div>- Sub menu 1-2</div>
<div>- Sub menu 1-3</div>
<div>- Sub menu 1-4</div>
<div>- Sub menu 1-5</div>
</div>
<div class="menu" onClick="slide('sub2');">메뉴항목 2</div>
<div id="sub2" class="submenu">
<div>- Sub menu 2-1</div>
<div>- Sub menu 2-2</div>
<div>- Sub menu 2-3</div>
<div>- Sub menu 2-4</div>
<div>- Sub menu 2-5</div>
<div>- Sub menu 2-6</div>
<div>- Sub menu 2-7</div>
<div>- Sub menu 2-8</div>
</div>
<div class="menu" onClick="slide('sub3');">메뉴항목 3</div>
<div id="sub3" class="submenu">
<div>- Sub menu 3-1</div>
<div>- Sub menu 3-2</div>
<div>- Sub menu 3-3</div>
</div>
<div class="menu" onClick="slide('sub4');">메뉴항목 4</div>
<div id="sub4" class="submenu">
<div>- Sub menu 4-1</div>
<div>- Sub menu 4-2</div>
<div>- Sub menu 4-3</div>
</div>
<div class="menu" onClick="slide('sub5');">메뉴항목 5</div>
<div id="sub5" class="submenu">
<div>- Sub menu 5-1</div>
<div>- Sub menu 5-2</div>
<div>- Sub menu 5-3</div>
<div>- Sub menu 5-4</div>
</div>
</body>
</html>
위는 기존에 "[HTML] 부드럽게 서브메뉴가 슬라이딩 되는 펼침메뉴" 입니다. 여기서 제가 링크1에 사진을 첨부헀는데
이런 링크를 이용하여 서브메뉴 클릭시 팝업창에 사진이 나오게 하고 싶습니다.
가르쳐 주세요.<div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 16:57:14 JavaScript에서 이동 됨]</div>
게시판 목록
프로그램
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 3930 | 14년 전 | 1356 | ||
| 3929 |
방황하는중년
|
14년 전 | 527 | |
| 3928 | 14년 전 | 644 | ||
| 3927 | 14년 전 | 694 | ||
| 3926 |
Lemios
|
14년 전 | 716 | |
| 3925 | 14년 전 | 994 | ||
| 3924 |
|
14년 전 | 1042 | |
| 3923 | 14년 전 | 1615 | ||
| 3922 | 14년 전 | 638 | ||
| 3921 |
피디인사이드
|
14년 전 | 1085 | |
| 3920 |
wgarlic
|
14년 전 | 2871 | |
| 3919 |
또치2009
|
14년 전 | 795 | |
| 3918 | 14년 전 | 750 | ||
| 3917 |
|
14년 전 | 1184 | |
| 3916 | 14년 전 | 1180 | ||
| 3915 | 14년 전 | 2022 | ||
| 3914 | 14년 전 | 1235 | ||
| 3913 | 14년 전 | 616 | ||
| 3912 | 14년 전 | 556 | ||
| 3911 | 14년 전 | 465 | ||
| 3910 | 14년 전 | 674 | ||
| 3909 | 14년 전 | 2190 | ||
| 3908 | 14년 전 | 628 | ||
| 3907 | 14년 전 | 648 | ||
| 3906 | 14년 전 | 743 | ||
| 3905 | 14년 전 | 949 | ||
| 3904 |
후라보노보노
|
14년 전 | 590 | |
| 3903 | 14년 전 | 871 | ||
| 3902 | 14년 전 | 1430 | ||
| 3901 |
fstjang
|
14년 전 | 666 | |
| 3900 | 14년 전 | 993 | ||
| 3899 |
|
14년 전 | 442 | |
| 3898 | 14년 전 | 507 | ||
| 3897 | 14년 전 | 986 | ||
| 3896 | 14년 전 | 1337 | ||
| 3895 | 14년 전 | 1423 | ||
| 3894 | 14년 전 | 891 | ||
| 3893 | 14년 전 | 816 | ||
| 3892 |
|
14년 전 | 1340 | |
| 3891 | 14년 전 | 864 | ||
| 3890 | 14년 전 | 3956 | ||
| 3889 | 14년 전 | 1890 | ||
| 3888 | 14년 전 | 683 | ||
| 3887 | 14년 전 | 605 | ||
| 3886 | 14년 전 | 3545 | ||
| 3885 |
후라보노보노
|
14년 전 | 4248 | |
| 3884 | 14년 전 | 987 | ||
| 3883 | 14년 전 | 1168 | ||
| 3882 | 14년 전 | 4405 | ||
| 3881 |
minini
|
14년 전 | 1221 | |
| 3880 | 14년 전 | 1001 | ||
| 3879 | 14년 전 | 749 | ||
| 3878 | 14년 전 | 766 | ||
| 3877 |
내꿈은대통령
|
14년 전 | 956 | |
| 3876 | 14년 전 | 886 | ||
| 3875 | 14년 전 | 1032 | ||
| 3874 | 14년 전 | 913 | ||
| 3873 | 14년 전 | 1332 | ||
| 3872 |
뜨드미지근
|
14년 전 | 680 | |
| 3871 |
SW커뮤니케이션
|
14년 전 | 540 | |
| 3870 |
방황하는중년
|
14년 전 | 565 | |
| 3869 | 14년 전 | 712 | ||
| 3868 | 14년 전 | 1177 | ||
| 3867 |
방황하는중년
|
14년 전 | 817 | |
| 3866 |
웹스커뮤니티
|
14년 전 | 1361 | |
| 3865 | 14년 전 | 1113 | ||
| 3864 |
|
14년 전 | 1086 | |
| 3863 | 14년 전 | 1055 | ||
| 3862 |
|
14년 전 | 1921 | |
| 3861 |
|
14년 전 | 3242 | |
| 3860 | 14년 전 | 1449 | ||
| 3859 | 14년 전 | 2390 | ||
| 3858 |
웹스커뮤니티
|
14년 전 | 1893 | |
| 3857 | 14년 전 | 1775 | ||
| 3856 |
크라잉감튀
|
14년 전 | 957 | |
| 3855 |
techer
|
14년 전 | 500 | |
| 3854 |
techer
|
14년 전 | 780 | |
| 3853 |
techer
|
14년 전 | 938 | |
| 3852 |
디자이너몽
|
14년 전 | 1654 | |
| 3851 | 14년 전 | 1711 | ||
| 3850 | 14년 전 | 1139 | ||
| 3849 | 14년 전 | 785 | ||
| 3848 | 14년 전 | 1008 | ||
| 3847 | 14년 전 | 1037 | ||
| 3846 | 14년 전 | 1055 | ||
| 3845 | 14년 전 | 587 | ||
| 3844 |
풍객리무진짱
|
14년 전 | 658 | |
| 3843 | 14년 전 | 780 | ||
| 3842 | 14년 전 | 1722 | ||
| 3841 | 14년 전 | 919 | ||
| 3840 | 14년 전 | 864 | ||
| 3839 | 14년 전 | 1152 | ||
| 3838 |
xkingcode
|
14년 전 | 767 | |
| 3837 | 14년 전 | 916 | ||
| 3836 | 14년 전 | 868 | ||
| 3835 |
temptiger
|
14년 전 | 1154 | |
| 3834 | 14년 전 | 701 | ||
| 3833 | 14년 전 | 708 | ||
| 3832 | 14년 전 | 619 | ||
| 3831 | 14년 전 | 727 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기