일반페이지 팝업창 띄우기(새창X)

매출이 오르면 내리는 수수료! 지금 수수료센터에서 전자결제(PG)수수료 비교견적 신청해 보세요!
일반페이지 팝업창 띄우기(새창X)

QA

일반페이지 팝업창 띄우기(새창X)

본문

일반페이지에서 팝업창을 새창이 아니라 페이지 내에서 띄우고 싶은데

소스가 test할때는 잘 움직이다가 해당 페이지에 삽입하면 에러가 떠요!

(심지어 100%에러는 아니고 여러개 팝업중에 몇개만 에러가 생겨요!)

그리고 팝업창 내에 스크롤도 안움직이는데 움직이게 해주세요

해결방법 좀 알려주세요ㅠㅠ

 


<ul class="sub3_01_g2">
      <li><img src="/images/sub3/sub3_1_img7.gif" alt=""></li>
      <li class="sub3_title">정신건강 심화 프로그램</li>
      <li class="sub3_01_g2_sub">
       <ul>
        <li>⋅  긍정해석</li>
 
<!-- 팝업 띄우는 소스 //-->
        <li><a href="#pop2" class="sub3_btn">⋅  스텝 업</a></li>
         <div class="popup" id="pop2">
          <div class="pop_btn"><a href="#a">닫기</a></div>
          <h2>스텝 업</h2>
          <p class="p_first">정신증, 우울증, 조울증, 여러 가지 신경증 등 만성화 경향을 보이는 정신질환은 질병의 초기 단계가 질병치료 및 회복에 결정적으로 중요한 시기입니다. 스텝업은 질병과 치료의 이해, 효율적인 증상관리, 일상으로의 회복을 위한 재활의 과정을 환우의 질환상태를 고려하여 단계적으로 학습하는 프로그램입니다.</p>
          <h5>1단계 : 질병과 치료의 이해</h5>
          <p>정신질환에서의 치료는 질병에 대한 정확한 정보를 전달하고, 치료 목표 및 치료 방향을 제시함으로써 질병을 받아들이고 적절한 치료기간을 유지하는 것이 중요합니다. 질병의 증상에 따른 만성화와 황폐화를 예방하고 방지하여 합리적이고 적응적인 행동으로 변화하도록 도움을 줍니다.</p>
          <h5>2단계 : 효율적인 증상관리</h5>
          <p>부정적 인지 도식을 다루고 스트레스 대처 기술 강화를 통해 심리적, 정서적 안정과 개선을 추구하며, 더 나은 내적심리, 대인관계 및 일상생활에서의 적응능력을 향상시키도록 도움을 줍니다.</p>
          <h5>3단계 : 일상으로의 회복</h5>
          <p>자신의 회복탄력성을 이해하고 새로운 회복의 관점과 삶의 방식을 체득하여 발병 이후 나타날 수 있는 심리사회적 변화에 적응함으로써 증상의 진행과 관계없이 주변 사람들과 더불어 살아갈 수 있도록 도움을 줍니다.</p>
         </div>
         <div class="dim"></div>
        <li><a href="#pop3" class="sub3_btn">⋅  행동변화를 위한 집단역동정신치료</a></li>
         <div class="popup" id="pop3">
          <div class="pop_btn"><a href="#a">닫기</a></div>
          <h2>행동변화를 위한 집단역동정신치료</h2>
          <p class="p_first">집단 내에서 타인과의 상호작용을 통해 자신의 생각·감정·행동을 돌아보고, 보다 긍정적인 변화를 위해 마련한 집단치료프로그램입니다. 이를 통해 일상생활에서 겪게 되는 다양한 대인관계 갈등 및 문제를 해소하는데 도움이 될 수 있습니다. 또한 스트레스 및 일상생활 관리를 효과적으로 할 수 있는 방법들을 배울 수 있습니다.</p>
         </div>
         <div class="dim"></div>
        <li>⋅  팀 접근 맞춤 상담시스템</li>
       </ul>
      </li>
     </ul>

 

 

 


/* css */
/*body*/
.sub3_01 {max-width: 1200px; margin:0 auto;}
.sub3_01_01 {text-align: center;padding: 0; margin:120px 0 0 0;}
.sub3_title {font-size: 22px;line-height: 24px;padding: 20px 0 20px;color: #333;border-bottom: 1px solid #e3e3e3; font-weight: 800;}
.sub3_01_02 {text-align:center;padding: 0; margin:120px 0 0 0;}
/*첫번째줄*/
.sub3_01_g1 {height:500px; width:274px; float:left; background-image:url("images/sub3_1_bg.jpg"); padding:0 28px; box-shadow: 0 0px 14px -6px rgba(0, 0, 0, 0.2); margin:0 20px 0 0;}
.sub3_01_g1 img {margin-top:-89px;}
.sub3_01_g1_sub ul {text-align:left; font-size:16px; line-height:24px; color:#666666; padding:10px 0 0 0px;}
.sub3_01_g1_sub ul li {padding:4px 0; display:block;}
.sub3_01_g2 {height:500px; width:274px; float:left; background-image:url("images/sub3_1_bg.jpg"); padding:0 28px; box-shadow: 0 0px 14px -6px rgba(0, 0, 0, 0.2); margin:0 20px 0 0;}
.sub3_01_g2 img {margin-top:-89px;}
.sub3_01_g2_sub ul {text-align:left; font-size:16px; color:#666666; padding:10px 0 0 0px;}
.sub3_01_g2_sub ul li {padding:4px 0; display:block; }
.sub3_01_g2_sub ul li a {width:220px; color: #149737; font-weight: bold;}
.sub3_01_g2_sub ul li a:hover {text-decoration:underline;}
.sub3_01_g3 {height:500px; width:274px; float:left; background-image:url("images/sub3_1_bg.jpg"); padding:0 28px; box-shadow: 0 0px 14px -6px rgba(0, 0, 0, 0.2); margin:0 20px 0 0;}
.sub3_01_g3 img {margin-top:-89px;}
.sub3_01_g3_sub ul {text-align:left; font-size:16px; color:#666666; padding:10px 0 0 0px;}
.sub3_01_g3_sub ul li {padding:4px 0; display:block; }
.sub3_01_g3_sub ul li a {width:220px; color: #149737; font-weight: bold;}
.sub3_01_g3_sub ul li a:hover {text-decoration:underline;}
.sub3_01_g4 {height:500px; width:274px; float:left; background-image:url("images/sub3_1_bg.jpg"); padding:0 28px; box-shadow: 0 0px 14px -6px rgba(0, 0, 0, 0.2);}
.sub3_01_g4 img {margin-top:-89px;}
.sub3_01_g4_sub ul {text-align:left; font-size:16px; color:#666666; padding:10px 0 0 0px;}
.sub3_01_g4_sub ul li {padding:4px 0; display:block; }
.sub3_01_g4_sub ul li a {width:220px; color: #149737; font-weight: bold;}
.sub3_01_g4_sub ul li a:hover {text-decoration:underline;}
 
.sub3_btn {color: #149737; font-weight: bold;}
.sub3_btn:hover {text-decoration:underline;}

/*팝업창*/
.popup {position:absolute; left:50%; top:50%; z-index:5; transform:translate(-50%,-50%); width:500px; height:500px; box-shadow:0 0 10px rgba(0,0,0,0.5); border-radius:5px; text-align:right; padding:20px; box-sizing:border-box; background:#fff; opacity:0; transition: all 0.5s; overflow-x:hidden; overflow-y:auto;}
.popup .pop_btn {width:60px; height:35px; background:#8ab365; float:right; text-align:center; padding:5px 0;}
.popup .pop_btn a {text-decoration:none; color:#ffffff;}
.popup h2 {text-align:center; font-size:25px; font-weight:700; margin:50px 0 0 0;}
.popup h4 {text-align:center; font-weight:600;}
.popup h5 {text-align:left; font-size:18px; margin:20px 0 0 0; font-weight:600;}
.popup .p_first {margin:30px 0 0 0; text-align:left; float:left;}
.popup p {margin:10px 0 0 0; text-align:left; float:left;}
.popup p > span {margin:0 0 0 47px;}
.popup:target {opacity:1;}
.popup:target + .dim {opacity:1; z-index:2;}
.dim {position:absolute; left:0; top:0; z-index:-1; width:100%; height:100%; background:rgba(0,0,0,0.6); opacity:0; transition: all 0.5s;}

이 질문에 댓글 쓰기 :

답변 1

혹시 말씀하신게 일반 팝업창이 아니라 레이어 팝업을 말씀하시는것 같은데 맞을까요??

 

만약 그러다면 관리자 환경설정안에 팝업레이어관리 라고 있지 않나요?

 

참고로 저는 영카트로 확인을 해서...경로는 자신의 사이트 url/adm/newwinlist.php 이던데...

 

확인 한번 해보세요

답변을 작성하시기 전에 로그인 해주세요.
전체 299
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT