modal창에 이미지 슬라이드를 빼고싶어요ㅠㅜ

Question

modal 태그를 적용 시키고 그 밑에 이미지 슬라이드를 적용시켰는데요 (따로따로)modal 창이 떴을 때 modal에 해당하는 이미지에 아래 이미지 슬라이드도 같이 modal 창에 올라와 있어요..modal에 해당하는 이미지만 적용시키고 싶은데 어떻게 해야할까요ㅠㅜ [html]

머그컵 핸드페인팅

이용 후기

★★★★★ 친절하게 도와주시고 차분한 분위기에 잔잔하게 노래도 나와서 좋은 시간 보낼 수 있었어요 :) (bul********)

★★★★ 좋은 추억을 만들 수 있어서 좋았다. (딸기***)

[css]/*modal*/ .main2{ width:720px; padding:0; margin:0; padding-left:25px;} .icon li{ list-style-type:none; width: 40px; float:left; margin-left : 620px; margin-top : -57px; }.icon btn{ background-color:#fff; list-style-type:none; }/*팝업*/.modal{ opacity:0; visibility:hidden; position:absolute; top:0; right:0; bottom:0; left:0; text-align:center; background:rgba(0,0,0,.6); transition:opacity .25s ease;}.modal_bg{ position:absolute; top:0; right:0; bottom:0; left:0; cursor:pointer;}.modal-state{ display:none;}.modal-state:checked + .modal{ opacity:1; visibility:visible;}.modal-state:checked + .modal .model__inner{ top:0;}.modal_inner{ transition:top .25s ease; position:absolute; top:15%; right:0; bottom:0; left:0; width:720px; margin:auto; overflow:hidden; /*background-color:#aaa;*/ background-repeat:no-repeat; background-size:100%; border-redius:5px; padding:1em 2em; height:1024px;}/* background-image:url(../images/kakapoback.png);*/.modal_close{ position:absolute; right:11em; top:1em; width:1.1em; height:1.1em; cursor:pointer;}.modal_close:after,.modal_close:before{ content:''; position:absolute; width:3px; height:1.5em; background:#fff; display:block; transform:rotate(45deg); left:50%; margin:-3px 0 0 -1px; top:0;}.modal_close:hover:after,.modal_close:hover:before{ background:#2727;}.modal_close:before{ transform:rotate(-45deg);}@media screen and (max-width:100%){ .modal_inner{ width:720px; height:1098px; box-sizing:border-box; }}.btn:hover,.btn:focus{ background:#fff;}.modal li{ list-style-type:none; width:430px; padding-top:100px; text-align:center; }.textCaption { font-family : 'NanumBarunGothic'; font-size : 0.85em; text-align :center; color : white; position : absolute; top : 370px; left: 50%; transform: translateX(-50%);} .ce {max-width : 110%; position: absolute; left: 50%; transform: translateX(-50%);} /*슬라이드*/ .slider{ width: 720px; height: 200px; position: relative; margin: 0 auto; }.slider input[type=radio]{ display: none;} ul.imgs{ padding: 0; margin: 0; }ul.imgs li{ position: absolute; left: 720px; transition-delay: 1s; list-style: none; padding: 0; margin: 0;} .bullets{ position: absolute; left: 50%; transform: translateX(-50%); top: 250px; z-index: 2;}.bullets label{ display: inline-block; border-radius: 50%; background-color: #bca4df; width: 17px; height: 17px; cursor: pointer;} .slider input[type=radio]:nth-child(1):checked~.bullets>label:nth-child(1){ background-color: #653aa6;}.slider input[type=radio]:nth-child(2):checked~.bullets>label:nth-child(2){ background-color: #653aa6;}.slider input[type=radio]:nth-child(3):checked~.bullets>label:nth-child(3){ background-color: #653aa6;} .slider input[type=radio]:nth-child(1):checked~ul.imgs>li:nth-child(1){ left: 0; transition: 0.5s; z-index:1;}.slider input[type=radio]:nth-child(2):checked~ul.imgs>li:nth-child(2){ left: 0; transition: 0.5s; z-index:1;}.slider input[type=radio]:nth-child(3):checked~ul.imgs>li:nth-child(3){ left: 0; transition: 0.5s; z-index:1;}

modal창에 이미지 슬라이드를 빼고싶어요ㅠㅜ

0개의 답변

#slider 목록