2012-09-05 3 views
0

나는 다소 단순하지만 무언가를하려고하지만 몇 가지 문제가 있습니다. 회전식 모드에서 BX 슬라이더 (www.bxslider.com)를 사용하고 싶습니다. 설치 및 작동을 얻을 수 있지만 슬라이더의 CSS 위치가 실제로 올바르지 않습니다. 내 FIDDLE (플러그인이 연결되어 있음)에서 볼 수 있으며, 축소판은 화면에서 벗어나 회색 상자에 있어야합니다! 나는이 문제를 바로 잡는 방법에 대한 조언을 정말 고맙게 생각한다. jQuery 캐 러셀 위치 지정 문제

내 JS입니다 :

$(document).ready(function() { 
    // start article gallery slider 
    var main_gallery_slider = $('#main_gallery_slider').bxSlider({ 
     auto: true, 
     controls: false, 
     displaySlideQty: 4 
    }); 

}); 

그리고 여기 내 HTML/슬라이더입니다 :

<div class="main_gallery" style="width:600px; background:#333; padding:10px;"> 
    <ul id="main_gallery_slider" style="width:600px;"> 
     <li><img src="myImage.jpg" width="90" height="60" /></li> 
     <li><img src="myImage.jpg" width="90" height="60" /></li> 
     <li><img src="myImage.jpg" width="90" height="60" /></li> 
     <li><img src="myImage.jpg" width="90" height="60" /></li> 
     <li><img src="myImage.jpg" width="90" height="60" /></li> 
     <li><img src="myImage.jpg" width="90" height="60" /></li> 
     <li><img src="myImage.jpg" width="90" height="60" /></li> 
     <li><img src="myImage.jpg" width="90" height="60" /></li> 
     <li><img src="myImage.jpg" width="90" height="60" /></li> 
    </ul> 
</div> 

내가 여기에 인라인을 추가하고 작은 비트에서이 떨어져에 갈 CSS가 없습니다 JSFiddle (http://jsfiddle.net/a59ne/1/)입니다.

답변

1

CSS에서 너비를 설정하면 li 태그의 너비가 적용되는 것이 문제입니다.

#main_gallery_slider li { width: 90px; } 

이렇게하면 너비가 모두 같다고 가정하면 해결됩니다.

+0

감사합니다. 정말 바보 같아. 나는 BXSlider가 문서/설치 노트에 CSS 예제를 제공하지 않았기 때문에 JS 스크립트가 슬라이딩 요소를 자동으로 스타일 지정하고 배치한다고 가정했습니다. – ShadowStorm