bxslider calculando o tamanho errado da viewport na carga
De qualquer forma eu comecei recentemente usando o bxslider e estou tendo um problema com isso.
Parece calcular seu tamanho de viewport incorretamente no carregamento da página, o que significa que ele não funciona bem em dispositivos móveis, tablets etc.
O mais estranho é que, quando eu redimensiono a janela do navegador (mesmo que apenas por um pixel), a altura da janela de visualização é calculada corretamente e tudo parece bem. Mas se eu atualizasse a página com a mesma altura e largura, o viewport bx não seria calculado corretamente.
Alguma idéia do porquê isso está acontecendo?
HTML parece algo assim (e sim, estou ciente de que provavelmente não tem nada a ver com isso, mas ainda assim):
<ul class="seminars-slider">
<li>
<article class="education-article">
<h3><a href="#"> Sit tincidunt eros massa, lundium ultrices, sit in aliquet velit</a></h3>
<p>LOL1</p>
<div class="buttons">
<a href="#" class="book-button"><span>Book now</span></a>
<a href="#" class="read-more"><span>Read more</span></a>
</div>
<div class="clearall"></div>
</article>
<div class="clearall"></div>
</li>
// same li
<li>
<article class="education-article">
<h3><a href="#"> Sit tincidunt eros massa, lundium ultrices, sit in aliquet velit</a></h3>
<p>LOL1</p>
<div class="buttons">
<a href="#" class="book-button"><span>Book now</span></a>
<a href="#" class="read-more"><span>Read more</span></a>
</div>
<div class="clearall"></div>
</article>
<div class="clearall"></div>
</li>
</ul>
js call parece com:
slider=jQuery('.seminars-slider').bxSlider({
mode: 'vertical',
controls:false,
pager:false,
minSlides:2,
maxSlides:2,
moveSlides:1
});
jQuery('.up-control').click(function() {
slider.goToNextSlide();
});
jQuery('.down-control').click(function() {
slider.goToPrevSlide();
});
Obrigado.