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

일반페이지 팝업창 띄우기(새창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 이던데...

 

확인 한번 해보세요

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

회원로그인

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