swiper 질문 채택완료

<div id="box">

    <div class="swiper-wrapper" >

        <div class="swiper-slide >
            <div class="item_lists" id="swiper-container-slide1000003219">
                <ul class="swiper-wrapper" >
                    <li class="swiper-slide"><a href="#">내용</a></li>
                    <li class="swiper-slide"><a href="#">내용</a></li>
                    <li class="swiper-slide"><a href="#">내용</a></li>
                </ul>
            </div>
        </div>

        <script id="rendered-js">
        $(document).ready(function () {
            var mySwiper = new Swiper('#swiper-container-slide1000003219', {
                slidesPerView : 'auto',
                spaceBetween : 10, 
            });
        });
        </script>


        <div class="swiper-slide" >
            <div class="item_lists" id="swiper-container-slide1000001668">
                <ul class="swiper-wrapper" >
                    <li class="swiper-slide"><a href="#">내용</a></li>
                    <li class="swiper-slide"><a href="#">내용</a></li>
                    <li class="swiper-slide"><a href="#">내용</a></li>
                </ul>
            </div>
        </div>

        <script id="rendered-js">
        $(document).ready(function () {
            var mySwiper = new Swiper('#swiper-container-slide1000001668', {
                slidesPerView : 'auto',
                spaceBetween : 10, 
            });
        });
        </script>

    </div>
      <div class="swiper-pagination"></div>
</div>

<script >
$(document).ready(function () {
    var swiper = new Swiper("#box", {
        scrollbarDraggable: false,
        touchRatio: 0,
        loop: true,
        effect : 'fade', 
        pagination: {
            el: ".swiper-pagination",
            type: "fraction",
        },
        navigation: {
            nextEl: ".swiper-pagination",
        },
    });

    $( ".swiper-pagination" ).prepend( "다른 추천상품 더보기 );
});

</script>