2013-04-26 3 views
0

Я хотел бы использовать bxSlider для создания слайдера, но первый слайд появляется один раз. Это просто встроенный слайд, который будет удален после загрузки следующего.Удалить первый слайд в bxSlider onSliderAfter, не нарушая его

HTML

<div id="slider"> 
    <ul> 
     <li class="one"></li> 
     <li></li> 
     <li></li> 
     <li></li> 
    </ul> 
</div> 

Я пытался что-то вроде

$('#slider ul').bxSlider({ 
     pager: false, 
     auto: true, 
     onSlideAfter : function(){ 
      $('#slider ul li.one').remove(); 
     } 
    }); 

Но это разбился ползунок, вероятно, до ширины слайдера не равно это начальная ширина теперь, один слайд был удален. Любая подсказка о том, как я должен это сделать?

ответ

1

После некоторого поиска и тестирования этого придумать

var topSlider = $('#slider ul').bxSlider({ 
    pager: false, 
    auto: true, 
    onSlideAfter : function(){ 
     if($('#slider ul li.one').length >= 1){ 
      $('#slider ul li.one').remove(); 
      topSlider.reloadSlider(); 
     } 
    } 
}); 

Таким образом, когда второй слайд будет сделан, я проверяю, если первый слайд все еще существует, если это так, я удалить его и перезагрузить ползунок без него. Кажется, работает очень хорошо.

0

Как насчет того, чтобы удалить его, в onSlideBefore вы проверяете, собираетесь ли вы на первый слайд, и если вы сразу отправляете его на второй?

$('#slider ul').bxSlider({ 
    pager: false, 
    auto: true, 
    onSlideBefore : function($slideElement, oldIndex, newIndex){ 
     if(newIndex == 0){ 
     $('#slider ul').bxSlider.goToSlide(1); 
     } 
    } 
}); 

Я не знаю, как bxslider будет реагировать, то есть вы скользите мимо первого слайда на пути ко второму слайду. Если это так, то это, вероятно, не сработает.