팝업 중간 버튼이랑 닫기 버튼들이 안먹힙니다..

매출이 오르면 내리는 수수료! 지금 수수료센터에서 전자결제(PG)수수료 비교견적 신청해 보세요!
팝업 중간 버튼이랑 닫기 버튼들이 안먹힙니다..

QA

팝업 중간 버튼이랑 닫기 버튼들이 안먹힙니다..

본문

팝업 중간 버튼이랑 닫기 버튼들이 안먹힙니다.. 

뭔가를 건드렸는데..

뭘수정해야할지 모르겠네요;;

 

 

 

    <style>
        #rolling-popup {position: absolute; width: 100vw; height: 1000vh; z-index: 9999999; top: 0; left: 0; background: rgba(0,0,0,0.8);display: flex; justify-content: center; }
        #rolling-popup .inner {position: relative; top: 100px;}
        #rolling-popup .inner .custom_img {width: 450px; height: 600px; overflow: hidden; background: white;}
        #rolling-popup .inner .custom_bt ul {display: flex; justify-content: space-between;}
        #rolling-popup .inner .custom_bt ul li {width: 100%; text-align: center; padding: 10px 0; background: #d6d3cd; font-size: 13px;}
        #rolling-popup .inner .custom_bt ul li:hover {background: #8f8a7c; color: white; cursor: pointer;}
        #rolling-popup .inner .custom_bt ul .on {background: #8f8a7c; color: white; cursor: pointer;}
        #rolling-popup .popup-ft {position: relative; z-index: 999999; cursor: pointer; text-align: right; top: 80px;}
        #rolling-popup .popup-ft button {border: none; background: none; color: white;margin-left: 20px;}
    </style>

    <div id="rolling-popup">
        <div>
            <div class="popup-ft">
                <button class="reject 24"><strong>24</strong>시간 동안 다시 열람하지 않습니다.</button>
                <button class="close rolling-popup custom_close">
                    <img src="/img/main/icon_3.png">
                </button>
            </div>
            <div class="slick">
                <div class="inner">
                    <div class="custom_img">
                        <img src="/img/pop/pop_1.jpg">
                        <img src="/img/pop/pop_2.jpg">
                        <img src="/img/pop/pop_3.jpg">
                        <img src="/img/pop/pop_4.jpg">
                        <img src="/img/pop/pop_5.jpg">

                        
                    </div>
                    <div class="custom_bt">
                        <ul>
                            <li class="on">7월 이벤트</li>
                            <li>점제거이벤트</li>
                            <li>피니어펌</li>
                            <li>주름을 쫙 핀다 </li>
                            <li>시그니처SPA</li>
                        
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <script>
        $('.custom_img').slick({
            arrows: false,
            fade: false,
            dots: false,
            pauseOnHover: false,
            pauseOnFocus: false,
        });
        $('.custom_bt ul li').click(function() {

            var slideNom = $(this).index();

            $('.custom_img').slick('slickGoTo', slideNom);
            $('.custom_bt ul li').removeClass('on');
            $(this).addClass('on');
        });

        $('.custom_close').click(function() {
            $('#rolling-popup').css('display', 'none');
        });


        function setCoooKiee( name, value, expiredays ){
            var todayDate = new Date();
            todayDate.setDate( todayDate.getDate() + expiredays );
            document.cookie = name + "=" + escape( value ) + "; path=/; expires=" + todayDate.toGMTString() + ";"
        }

        function getCooKiee( name ){
            var nameOfCookie = name + "=";
            var x = 0;
            while ( x <= document.cookie.length ){
                var y = (x+nameOfCookie.length);
                if ( document.cookie.substring( x, y ) == nameOfCookie ) {
                    if ( (endOfCookie=document.cookie.indexOf( ";", y )) == -1 ){
                        endOfCookie = document.cookie.length;
                    }
                    return unescape( document.cookie.substring( y, endOfCookie ) );
                }
                x = document.cookie.indexOf( " ", x ) + 1;
                if ( x == 0 ) break;
            }
            return "";
        }

        function closePop(name) {
            $('#'+name).remove();
        }

        $("#rolling-popup .reject").click(function() {
            setCoooKiee('rolling-popup', 'Y', 1);
            closePop('rolling-popup');
        });
        if ( getCooKiee("rolling-popup") == "Y" ){
            closePop('rolling-popup');
        }
 

이 질문에 댓글 쓰기 :

답변 2

스크립트가 안 닫혔네요

마지막에 추가해주세요

</script>

아 slick 슬라이더 쓰시는거같은데 slick 파일이 안 들어간거 같네요 제가 원래 slick을 쓰던 페이지에 테스트해봐서 잘 됐나봐요
https://kenwheeler.github.io/slick/
다운 받으셔서 js 파일 추가해보세요

제이쿼리랑 슬릭 넣으니깐 잘되네요..

 

<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css"/>

<script src="http://code.jquery.com/jquery-latest.min.js"></script>

<script type="text/javascript" src="http://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>

답변을 작성하시기 전에 로그인 해주세요.
전체 0
QA 내용 검색
filter #css ×
  • 개별 목록 구성 제목 답변작성자조회작성일
  • 질문이 없습니다.

회원로그인

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