테스트 사이트 - 개발 중인 베타 버전입니다

bxslider 썸네일 이미지 로드 오류 좀 봐주세요ㅠㅠ

한희송 8년 전 조회 4,577

큰 이미지랑 썸네일 이미지랑 싱크가 안맞아요ㅜㅜ 

마지막 이미지가 로드되있네요ㅠㅠㅠ왜그런걸까요...

계속 새로고침하면 싱크맞게 출력되고 ...

왜이런거죠ㅠㅠ

http://hanheesong93.dothome.co.kr/test1/index.html">http://hanheesong93.dothome.co.kr/test1/index.html

 

</p><p> </p><p>                      <style></p><p>                          </p><p>                            .bx-wrapper {</p><p>                              position: relative;</p><p>                              margin-bottom: 30px;</p><p>                              padding: 0;</p><p>                              *zoom: 1;</p><p>                              -ms-touch-action: pan-y;</p><p>                              touch-action: pan-y;</p><p>                            }</p><p>                          .bx-wrapper img {</p><p>  max-width: 100%;</p><p>  width: 100%;</p><p>  display: block;</p><p>  max-height: 551px;</p><p>}</p><p>                            .bx-wrapper .bx-pager a {</p><p>                                border: solid #fff 1px;</p><p>                                display: block;</p><p>                                margin: 0px;</p><p>                                padding: 0px;</p><p>                                box-sizing: border-box;</p><p>                            }</p><p>.bx-wrapper .bx-pager {</p><p>  text-align: center;</p><p>  font-size: .85em;</p><p>  font-family: Arial;</p><p>  font-weight: bold;</p><p>  color: #666;</p><p>  padding-top: 20px;</p><p>}</p><p>                          .bx-wrapper .bx-pager.bx-default-pager a {</p><p>  background: none;</p><p>  text-indent: -9999px;</p><p>  display: block;</p><p>  width: 10px;</p><p>  height: 10px;</p><p>  margin: 0 5px;</p><p>  outline: 0;</p><p>    border: 1px solid #fff;</p><p>  -moz-border-radius: 5px;</p><p>  -webkit-border-radius: 5px;</p><p>   </p><p>}</p><p>                          .bx-wrapper .bx-pager-item,</p><p>.bx-wrapper .bx-controls-auto .bx-controls-auto-item {</p><p>  display: inline-block;</p><p>  vertical-align: bottom;</p><p>  *zoom: 1;</p><p>  *display: inline;</p><p>}</p><p>             .bx-wrapper .bx-controls-direction a {</p><p>  display: none;</p><p>}             </p><p> </p><p>                            .bx-wrapper .bx-pager a:hover,</p><p>                            .bx-wrapper .bx-pager a.active {</p><p>                                border: solid #e17d3a 1px;</p><p>                            }</p><p> </p><p>                            .bx-wrapper {</p><p> </p><p>                            }</p><p>                          .bx-wrapper {height: 570px;}</p><p>                          .bx-pager-item {width: 162.98px; height: 105px;}</p><p>                      </style></p><p>             </p><p>                                <ul class="bxslider"></p><p>                                  <li><img src="/img/ulsan/introduction/hospital/o/01.jpg" /></li></p><p>                                  <li><img src="/img/ulsan/introduction/hospital/o/02.jpg" /></li></p><p>                                  <li><img src="/img/ulsan/introduction/hospital/o/03.jpg" /></li></p><p>                                  <li><img src="/img/ulsan/introduction/hospital/o/04.jpg" /></li></p><p>                                  <li><img src="/img/ulsan/introduction/hospital/o/05.jpg" /></li></p><p>                                  <li><img src="/img/ulsan/introduction/hospital/o/06.jpg" /></li></p><p>                                </ul></p><p>            </p><p>             </p><p>                </p><p>      <script></p><p>        $(document).ready(function(){</p><p>            $('.bxslider').bxSlider({</p><p>              buildPager: function(slideIndex){</p><p>                switch(slideIndex){</p><p>                  case 0:</p><p>                    return '<img src="/img/ulsan/introduction/hospital/o/thumb_01.jpg">';</p><p>                  case 1:</p><p>                    return '<img src="/img/ulsan/introduction/hospital/o/thumb_02.jpg">';</p><p>                  case 2:</p><p>                    return '<img src="/img/ulsan/introduction/hospital/o/thumb_03.jpg">';</p><p>                  case 3:</p><p>                    return '<img src="/img/ulsan/introduction/hospital/o/thumb_04.jpg">';</p><p>                  case 4:</p><p>                    return '<img src="/img/ulsan/introduction/hospital/o/thumb_05.jpg">';</p><p>                  case 5:</p><p>                    return '<img src="/img/ulsan/introduction/hospital/o/thumb_06.jpg">';</p><p>                }</p><p>              }</p><p>            });</p><p>        });</p><p>            </p><p>        </script></p><p>    </body></p><p></html></p><p>

댓글을 작성하려면 로그인이 필요합니다.

답변 1개

원본을 넣어보고 이미지만 교체해보시는게 빠를듯..

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인