slick 슬라이드 사용중인데 width 자동으로 100% 되게 할수 없나요??
본문
페이지에 처음 들어갔을때 계속 width 0px로 설정되서 어느정도 시간이 흐르거나 마우스를 갖다대야 width가 100%로 바뀌는데 처음 들어갔을때부터 width가 100%로 되게 할순 없나요?
답변 2
slick 으로 수없이 메인 슬라이드를 만들어본 경험상.. 처음에 width 0px 으로 설정되는건,
셋팅이 잘못된거라고 판단이 됩니다.
페이지주소나 적용한 slick script 를 한번 보여주세요.
그리고 혹시 모르니 슬라이드 되는 이미지에 width:100%; height:auto 적용되었는지도 보세요~
최신글로 만드시는거네요. 혹시 탭메뉴로 만드시는건가요?
만약, 두번째 탭에 셋팅을 하신거라면 width:0px로 잡히는건 맞는 결과입니다.
탭은 display:none 되어있다가 block 이 되어서, 슬라이드 최초 로딩시 width 값을 인식을 못합니다.
그래서 해결법은 구글링하면 탭메뉴를 인식하게해서 slick 을 맞춘 스크립트도 검색이 많이 되구요.
탭메뉴이거나 아닐지라도 width 값을 인식못한다면,
옵션값으로 variableWidth : true, 이걸 넣어주세요.
그리고 해당 width 값을 px로 지정하시면 됩니다.
slidesToShow: 2, << 이 옵션을 넣어서 보여질 갯수도 정해서 넣어주세요~~
감사합니다 width문제 해결됐어요!! 혹시 그림에 글씨를 캡션 넣는 옵션도 있나요?
그 옵션까진 모르겠네요.
그냥 사진위에 글씨를 position:absolute 로 올려서 원하시는대로 코딩하시면 됩니다~
혹시 맞아 떨어질지 모르겠지만
css중 해당 클래스 width에 !important 붙여보세요
css에 해당 클래스 width주는 부분이 없어서 새로 만들어서 width !important을 줬는데 사진이 안나와요..
.slick-slide{
width: 100% !important;
}
이렇게 추가했어요
