bxslider 썸네일 이미지 로드 오류 좀 봐주세요ㅠㅠ
큰 이미지랑 썸네일 이미지랑 싱크가 안맞아요ㅜㅜ
마지막 이미지가 로드되있네요ㅠㅠㅠ왜그런걸까요...
계속 새로고침하면 싱크맞게 출력되고 ...
왜이런거죠ㅠㅠ
http://hanheesong93.dothome.co.kr/test1/index.html
Copy
<style> .bx-wrapper { position: relative; margin-bottom: 30px; padding: 0; *zoom: 1; -ms-touch-action: pan-y; touch-action: pan-y; } .bx-wrapper img { max-width: 100%; width: 100%; display: block; max-height: 551px;} .bx-wrapper .bx-pager a { border: solid #fff 1px; display: block; margin: 0px; padding: 0px; box-sizing: border-box; }.bx-wrapper .bx-pager { text-align: center; font-size: .85em; font-family: Arial; font-weight: bold; color: #666; padding-top: 20px;} .bx-wrapper .bx-pager.bx-default-pager a { background: none; text-indent: -9999px; display: block; width: 10px; height: 10px; margin: 0 5px; outline: 0; border: 1px solid #fff; -moz-border-radius: 5px; -webkit-border-radius: 5px; } .bx-wrapper .bx-pager-item,.bx-wrapper .bx-controls-auto .bx-controls-auto-item { display: inline-block; vertical-align: bottom; *zoom: 1; *display: inline;} .bx-wrapper .bx-controls-direction a { display: none;} .bx-wrapper .bx-pager a:hover, .bx-wrapper .bx-pager a.active { border: solid #e17d3a 1px; } .bx-wrapper { } .bx-wrapper {height: 570px;} .bx-pager-item {width: 162.98px; height: 105px;} </style> <ul class="bxslider"> <li><img src="/img/ulsan/introduction/hospital/o/01.jpg" /></li> <li><img src="/img/ulsan/introduction/hospital/o/02.jpg" /></li> <li><img src="/img/ulsan/introduction/hospital/o/03.jpg" /></li> <li><img src="/img/ulsan/introduction/hospital/o/04.jpg" /></li> <li><img src="/img/ulsan/introduction/hospital/o/05.jpg" /></li> <li><img src="/img/ulsan/introduction/hospital/o/06.jpg" /></li> </ul> <script> $(document).ready(function(){ $('.bxslider').bxSlider({ buildPager: function(slideIndex){ switch(slideIndex){ case 0: return '<img src="/img/ulsan/introduction/hospital/o/thumb_01.jpg">'; case 1: return '<img src="/img/ulsan/introduction/hospital/o/thumb_02.jpg">'; case 2: return '<img src="/img/ulsan/introduction/hospital/o/thumb_03.jpg">'; case 3: return '<img src="/img/ulsan/introduction/hospital/o/thumb_04.jpg">'; case 4: return '<img src="/img/ulsan/introduction/hospital/o/thumb_05.jpg">'; case 5: return '<img src="/img/ulsan/introduction/hospital/o/thumb_06.jpg">'; } } }); }); </script> </body></html>
답변 1개
돼지코구뇽
2017-06-09 (금) 05:14:36
원본을 넣어보고 이미지만 교체해보시는게 빠를듯..
답변을 작성하려면 로그인이 필요합니다.