Как сделать платвное появление bxSlider?

Question

[...]

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

Answer 1

[Максим Тимофеев]

Прозрачность в css - opacity: 0; при этом 0 полная прозрачность, 1 наоборот.
$( document ).ready() - событие готовности страницы

Так что так:

$( document ).ready(function() {
    $('.myslider').addClass('itsalive');
});

в css

.myslider {opacity:0; transition: opacity 1s ease;}
.myslider.itsalive {opacity:1;}

Comments

[...]

Не помогло. Я собсвтенно делаю по причине какого-то не понятного косяка..
При загрузке страницы, слайдер вот такого вида становится, а когда страница загружается то нормально...

prntscr.com/fr0esh

[Максим Тимофеев]

...: ссылку на сайт или код выкладывайте в https://jsfiddle.net

[...]

Максим Тимофеев:

<div data-reactroot="" class="loading-spinner"></div>
<div class="slider">
....
</div>

<script>
$(document).ready(function(){
$('.slider').bxSlider({
  onSliderLoad: function(){
    $('.loading-spinner').hide();
    $('.slider').show();
  },
  auto: true,
  slideWidth: 163,
  moveSlides: 3,
  minSlides: 6,
  maxSlides: 6,
  slideMargin: 10,
  touchEnabled: false,
  pager: false,
  nextText: '',
  prevText: '',
});
});
</script>

+ подключаю jquery.bxslider.min

[Максим Тимофеев]

...: Зачем мне код Ваш? Я попросил ссылку на сайт или код на https://jsfiddle.net
Как дебажить то что вы дали?

[...]

Максим Тимофеев: черканите почту, отправлю ссылку

[Максим Тимофеев]

еще вариант

<script>
$(document).ready(function(){
$('.slider').bxSlider({
  onSliderLoad: function(){
    $('.loading-spinner').hide();
    $('.slider').show();
   $('.myslider').addClass('itsalive');
  },
  auto: true,
  slideWidth: 163,
  moveSlides: 3,
  minSlides: 6,
  maxSlides: 6,
  slideMargin: 10,
  touchEnabled: false,
  pager: false,
  nextText: '',
  prevText: '',
});
});
</script>