$(".gototop").hide();
$(window).scroll(function () {
  var y = window.scrollY;

  if (y > 10) {
    $(".gototop").show();
  } else {
    $(".gototop").hide();
  }

});

$("*").each(function (index, element) {
    // 此元素被點選後執行
    $(this).click(function (e) {
      // 取得被點選元素的屬性：data-gt-target
      var target = $(this).attr("data-gt-target");
      var duration = $(this).attr("data-gt-duration");
      var offset = $(this).attr("data-gt-offset");
  
      // JS 語法：判斷式
      // if (條件) {程式區塊}
      // 當條件成立，會執行程式區塊
  
      // 如果 目標有資料 才會執行 { } 內的程式
      // 避免出現 undefine (未定義 - 不存在的資料)
      if (target) {
        //console.log("目標：" + target);
        //console.log("時間：" + duration);
        //console.log("位移：" + offset);
  
        // 上方位置 = 目標區塊.位移().上方位置
        var top = $(target).offset().top;
        //console.log("要前往元素的上方位置：" + top);
  
        // 網頁元素.停止().動畫({ 上方捲動：指定元素 - 位移}，持續時間)
        // parseInt() 將文字轉為數字
  
        $("html").stop().animate({
          scrollTop: top - offset
        }, parseInt(duration));
      }
    });
  });
  
  // 避免動畫與使用者滾輪衝突
  // html 在滾動滾輪時 停止 html 所有效果
  $("html").on("mousewheel", function () {
    $("html").stop();
  });

$(".playbutton").click(function () {
    var videosrc = $(this).data("info");
    $('.youtube-video').attr('src', `https://www.youtube.com/embed//${videosrc}?autoplay=1`);
  });
  
  $(".btn-close").click(function () {
    $('.youtube-video').attr('src', ``);
  });
  
  $('#yt-video').on('hidden.bs.modal', function () {
    $('.youtube-video').attr('src', ``);
  });

$(".banner-slide").slick({
    dots: true,
    autoplay: true,
    arrows: false,
    slidesToShow: 1,
    slidesToScroll: 1,
    autoplaySpeed: 7000,
    initialSlide: 0,
    infinite: true,
});

$(".violetbeauty_sec01_slide").slick({
 
    slidesToShow: 4,
    slidesToScroll: 1,
    infinite: true,
    // centerMode: true,
    arrows: true,
    prevArrow: '<button type="button" class="slick-prev"><i class="fas fa-chevron-left" style="font-size: 32px;color: #CC7DB7;transform: translateY(-10px);"></i></button>',
    nextArrow: '<button type="button" class="slick-next"><i class="fas fa-chevron-right" style="font-size: 32px;color: #CC7DB7;transform: translateY(-10px);"></i></button>'
});

