Front-End/javascript

bxslider modal popup problem in javascript

ducks228 2018. 11. 20. 15:00

모달 팝업으로 띄울때 bxslider가 잘 작동을 안함


수정후 현재까진 잘 작동하는거 같음


모달이 있는 화면에서

var slide = '';

$(document).ready(function(){

slide =  $('ul.list-layoutSelect').bxSlider();


});


모달팝업이 띄워지는 소스

setTimeout(function(){

    apiLayout();

}, 500);


모달이 있는 화면

function apiLayout() {

slide.reloadSlider( {

slideWidth:150,

mode: 'horizontal',// 가로 방향 수평 슬라이드

speed: 1000,        // 이동 속도를 설정

pager: false,     // 현재 위치 페이징 표시 여부 설정

moveSlides:6,     // 슬라이드 이동시 개수

minSlides: 2,      // 최소 노출 개수

maxSlides: 6,      // 최대 노출 개수

slideMargin:10,    // 슬라이드간의 간격

auto: false,        // 자동 실행 여부

infiniteLoop: false,

autoHover: false,   // 마우스 호버시 정지 여부

controls: true,    // 이전 다음 버튼 노출 여부

prevText:"",

nextText: "",

prevSelector: '.box-layoutSelect .btn-slidePrev',

nextSelector: '.box-layoutSelect .btn-slideNext'

});

}


=========================================================================


모달팝업에서 bxslider나 slick 등 library들은 시점을 조정하기가 힘들다.

시간만 많이 잡아 먹어서 jquery에서 제공하는 소스를 사용했다.