2014-11-18 2 views
6

OWL 회전식 메뉴를 사용하고 있으며 이미지가 1 개 표시되고 다음 15 초마다 다음 이미지가 삽입되도록 코드를 작성했습니다. 너비를 100 %로 설정했습니다. 그래서 화면에 이론적으로 전체 크기로 한 번에 하나의 이미지가 있어야합니다. 그러나 어떤 일이 발생하는지는 다소 작은 이미지를 보여줍니다. 그런 다음 화면 크기를 1 픽셀로 조정해도 크기가 조정됩니다. 어떻게해야합니까 .....OWL 회전식 이미지 처음에는 올바른 크기가 아닙니다.

전체 크기로 이미지를 얻기 위해 화면의 크기를 조정하지 않아도되는 방법에 대한 아이디어는 무엇입니까? 여기

내 HTML 여기

<div class="owl-carousel"> 
    <img src="assets/background1.jpg" /> 
    <img src="assets/background2.jpg" /> 
    <img src="assets/background3.jpg" /> 
</div> 

입니다 내 JS

var owl = $('.owl-carousel'); 
owl.owlCarousel({ 
    singleItem: true, 
    items:1, 
    loop:true, 
    margin:10, 
    autoplay:true, 
    autoplayTimeout:15000, 
    autoplayHoverPause:true 


}); 
$('.play').on('click',function(){ 
    owl.trigger('autoplay.play.owl',[1000]) 
}) 
$('.stop').on('click',function(){ 
owl.trigger('autoplay.stop.owl') 
}) 
+0

질문에 입력 한 태그의 설명을 읽으십시오. 이것은 Web Ontology Language ([tag : owl])에 관한 것이 아니라 OWL Carousel ([tag : owl-carousel])에 관한 질문입니다. –

+0

또한 코드를 표시하면 도움이 될 것입니다. 그렇지 않으면 사람들이 당신이 그것을 바꿀 수있는 것을 어떻게 식별 할 수 있습니까? –

+0

입력 해 주셔서 감사합니다. 내 코드를 추가했습니다. – RubberDucky4444

답변

9

이유는 다음 중 하나 일 수 있습니다

  1. 어느 쪽이든 당신은 owl.owlCarousel 메소드를 호출하고 DOM이로드되기 전에. 그러므로 문서 준비를 시작하십시오.
  2. 또는 .owl-carousel div가 DOM로드시 보이지 않는 컨테이너 안에있을 수 있습니다.

나는 부트 스트랩 모달에 올빼미 회전 목마를 사용하는 비슷한 문제에 직면 그것은 부트 스트랩 모달의 shown 이벤트에 owlCarousel를 시작하여 수정되었습니다.

자세한 내용이 필요하거나 해결해야하는 경우 알려주십시오.

+0

DOM을로드하기 전에 회전식 전화를 부탁했습니다. 그것은 지금 위대한 작품! – RubberDucky4444