bxSliderのビューの乱れ

トップページにbxsliderを設置し写真をスライド出来るようにしましたが、トップページに戻ろうとするとビューが乱れ写真がバラバラになってしまいます。更新ボタンを押すと乱れていたビューが元に戻ります。
どなたか分かりますでしょうか？

症状はこちらになります
https://gyazo.com/7e9ced9706a3b31e7b64e392c9b5ecce

ruby(application.html)
1<!DOCTYPE html>
2<html>
3  <head>
4    <title>Matsubokkuri</title>
5    <%= csrf_meta_tags %>
6    <%= csp_meta_tag %>
7
8    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
9    <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
10   
11    <link rel="stylesheet" href="https://cdn.jsdelivr.net/bxslider/4.2.12/jquery.bxslider.css">
12   <script src="https://cdn.jsdelivr.net/bxslider/4.2.12/jquery.bxslider.min.js"></script>
13   
14
15    <script>
16      $(document).ready(function(){
17       $('.bxslider').bxSlider({
18        auto: true
19	    	touchEnabled: false
20       });
21      });
22    </script>
23
24  </head>
25
26  <body>
27  <header class="header">
28      <div class="header__bar row">
29        <h1 class="grid-6">
30         <a href="/">Matsubokkuri</a></h1>
31         <div class="tento"><img src="/assets/camp008.png"></div>
32         <%= link_to "toppage", root_path, class: "toppage" %>
33           <% if user_signed_in? %>
34           <div class="user_nav grid-6">
35           <span><%= current_user.nickname %>
36            <div class="user__info">
37                <%= link_to "マイページ", "/users/#{current_user.id}" %>
38                <%= link_to "ログアウト", destroy_user_session_path, method: :delete %>
39            </div>
40           </span>
41            <%= link_to "投稿する", new_tweet_path, class: "push" %>
42          </div>
43        <% else %>
44          <div class="grid-6">
45            <%= link_to "ログイン", new_user_session_path, class: "post" %>
46            <%= link_to "新規登録", new_user_registration_path, class: "post" %>
47          </div>
48        <% end %>
49      </div>
50      </header>
51
52       <div class="bxslider">
53        <div class="bxslider_slider"><img src="/assets/coffee1.jpg" title="" ></div>
54        <div class="bxslider_slider"><img src="/assets/coffee2.jpg" title="" ></div>
55        <div class="bxslider_slider"><img src="/assets/coffee3.jpg" title="" ></div>
56       </div>
57    <%= yield %>
58    <footer>
59      <p>
60        Copyright Matsubokkuri 2021.
61      </p>
62    </footer>
63  </body>
64</html>
65

javascript(bxslider.js)
1$(function(){
2  $('.bxslider').bxSlider({
3    mode: 'fade',
4    captions: true,
5    auto: true,
6    slideWidth: 2000,
7  });
8});