레이어팝업 질문드립니다. 채택완료
그누배우자
2년 전
조회 1,310
안녕하세요
아래 처럼 간단한 레이어팝업을 사용중입니다.
(클릭 하면 뜨는 창)
a링크 open1을 누르면 id open1 이 뜨는 형식입니다.
</p>
<p><a href="#open1">보기</a></p>
<p> </p>
<p><div class="pop_content" id="open1">
<div class="pop_wrap"></p>
<p> <div class="point1">1</div></p>
<p> <p>팝업내용</p>
</div>
</div></p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p>css</p>
<p>.pop_content {
display:block;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
opacity:0;
padding:0;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
pointer-events: none;
z-index:99999;
background:rgba(0,0,0,0.5)
}
.pop_content:target {
opacity:1;
pointer-events: auto;
}
.pop_content .pop_wrap {
position:absolute;
z-index: 99;
padding:50px 10px;
background:#fff;
width: 100%;
height:100%;
}</p>
<p>
이렇게 사용중인데
open1 을 누르면 팝업안 class중
open2를 누르면 class="point2" 가
open3을 누르면 class="point3" 이...
한 20개 정도 되는데
이걸 일일이 20개 만드는건 너무 비효율적일것같아서요..ㅎ
혹시 효육적인 기가막힌 방법이 있을지요..
고수님들의 도움 부탁드립니다..ㅠ
댓글을 작성하려면 로그인이 필요합니다.
답변 2개
채택된 답변
+20 포인트
2년 전
</p>
<p><a href="javascript:" onclick="open_layer('open1')">보기</a></p>
<p> </p>
<p><script></p>
<p>function open_layer(id) {</p>
<p> $('#'+id).show();</p>
<p>}</p>
<p></script></p>
<p>
로그인 후 평가할 수 있습니다
댓글을 작성하려면 로그인이 필요합니다.
2년 전
</p>
<p><?php for($i=1;$i<=20;$i++){ ?>
<a href="#open<?php echo $i ?>">보기</a></p>
<p> <div class="pop_content" id="open<?php echo $i ?>">
<div class="pop_wrap">
<div class="point"><?php echo $i ?></div>
<p>팝업내용<?php echo $i ?></p>
</div>
</div>
<?php } ?>
로그인 후 평가할 수 있습니다
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인