Нежелательное пустое пространство в нижней части загрузочного слайдера карусели в приложении rails? - PullRequest
0 голосов
/ 24 мая 2018

У меня есть код для целевой страницы с 4 картинками, которые меняются с помощью карусели:

<div class="row">
  <div class="col-12 welcome d-flex align-items-center justify-content-center" >
    <div class="welcome-slider">
      <div class="carousel slide">
        <div class="carousel-inner">

          <div class="carousel-item active">
              <%= image_tag 'Eureka.jpg', class: 'd-block w-100' %>
          </div>

          <div class="carousel-item">
            <%= image_tag 'pensive.jpg', class: 'd-block w-100' %>
          </div>


          <div class="carousel-item">
            <%= image_tag 'NYC.jpg', class: 'd-block w-100' %>
          </div>

          <div class="carousel-item">
            <%= image_tag 'Success.jpg', class: 'd-block w-100' %>
          </div>


        </div>
      </div>
    </div>

    <div class="comingsoon">
        <h1 class="font-white"> Coming soon </h1>
    </div>

  </div>
</div>

Вот мой код: посадки.coffee

    $(document).on "turbolinks:load", ->
      $('.carousel').carousel()

И static_pages.coffee

$item = $('.carousel-item')
$wHeight = $(window).height()
$item.height $wHeight
$item.addClass 'full-screen'
$('.carousel img').each ->
  $src = $(this).attr('src')
  $color = $(this).attr('data-color')
  $(this).parent().css
    'background-image': 'url(' + $src + ')'
    'background-color': $color
  $(this).remove()
  return
$(window).on 'resize', ->
  $wHeight = $(window).height()
  $item.height $wHeight
  return

Соответствующий CSS:

.full-screen {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

Кажется, что coffeescript вообще не влияет на страницу, так как пробел существует с ним или без него.Кто-нибудь может помочь посоветовать, как избавиться от пробелов внизу страницы?Нужен ли какой-нибудь из этих сценариев?

...