7월4일32일차 - slick에 video 넣기, 웹코딩1(식품)

이번에는 Mcdonalds를 코딩해봅니다.

메인화면에 video를 넣을텐데, slick slide로 여러 비디오를 넣습니다.

[220706 식품코딩Mc] [ 220706 식품코딩Mc html / css / js ]

---

main에 header 높이만큼을 제외하고 video를 배경으로 주는 방법입니다.

        <section class="mainVisual">

          <div class="mainSlider">

            <div class="slider01">

              <div class="bgVideo bgVideo01"></div>

            </div>

.bgVideo {

  height: calc(100vh - 140px);

}

slick에서 현재 슬라이드의 index는 c 입니다.
  $(".slider").on("afterChange", function (e, s, c) {
    if (c == 0) {
      $("#bgVideo01").YTPPlay();
      $("#bgVideo02").YTPPause();
    } else {
      $("#bgVideo01").YTPPause();
      $("#bgVideo02").YTPPlay();
    }