New-Bhouse-Web/themes/hugo-universal-theme-master/static/js/bhouse.js

$(".responsive").slick({
  dots: true,
  slidesToShow: 1,
  slidesToScroll: 1,
  autoplay: true,
  autoplaySpeed: 3000,
  arrows: false,
});

// 直式輪播圖動態更改高度
function changeHeight() {
  let firstImg = $('.style_house_sec02_slide div:first-child img');
  let firstImgHeight = firstImg.css('height');
  $('.style_house_sec02_slide .vertical-img').css("height", `${firstImgHeight}`)
}
changeHeight();
$(window).resize(function () {
  setTimeout(() => {
    changeHeight();
  }, 100)
});

let imgCount = $(".slide_single_img").length;
let heightImg = [];

$('.slide_single_img').each(function (i) { // jquery.each() 循環讀取所有圖片
  let height = $(this).height();
  let width = $(this).width();
  let x = (height / width);
  console.log('index', i);
  console.log('height / width = ', x);
  if (x >= 1 && i !== 0) {
    heightImg.push($(this));
    // 預設高度為 0
    $(this).css({
      'height': 0 + 'px',
      "margin": 'auto',
    });
  }
});

let heightImgIndex = [];

function getAllIndex(arr) {
  // 篩選符合條件 Index
  for (i = 0; i < arr.length; i++) {
    if (arr[i].height === 0)
      heightImgIndex.push(i);
  }
  return heightImgIndex;
}
let allSlideImg = document.querySelectorAll('.slide_single_img');
getAllIndex(allSlideImg);

// 取得 slick 當前的 Index
$('.style_house_sec02 .slider').on('beforeChange', function (event, slick, currentSlide, nextSlide) {
  for (i = 0; i < heightImgIndex.length; i++) {
    console.log(heightImgIndex[i]);
    if (nextSlide == heightImgIndex[i]) {
      allSlideImg[nextSlide].style.cssText = `
      height: 500px; 
      margin: auto;
    `;
    } else {
      allSlideImg[heightImgIndex[i]].style.height = '0px';
    }
  }
});

$('.slide_img').each(function () { // jquery.each() 循環讀取所有圖片
  var height = $(this).height();
  var width = $(this).width();
  let x = (height / width);
  if (x > 1) {
    $(this).css({
      'width': 100 + 'px',
      "margin": 'auto',
      "padding": "0px",
    });
  } else {
    $(this).css({
      "margin-top": '30px',
      "padding": "5px",
    });
  }
});

$('.style_house_sec02 .slider-for').slick({
  slidesToShow: 1,
  slidesToScroll: 1,
  arrows: false,
  fade: true,
  asNavFor: '.slider-nav'
});
$('.style_house_sec02 .slider-nav').slick({
  slidesToShow: 5,
  slidesToScroll: 3,
  asNavFor: '.slider-for',
  dots: false,
  arrows: false,
  // centerMode: true,
  focusOnSelect: true
});

$(document).on("click", ".article__readMore", function (event) {
  $('.bhouseweb_loc_sec02').css('height', 'auto');
  $('.article__readMore').hide();

});

$(document).on("click", ".bhouseweb_loc_type>a", function (event) {
  $(this).siblings().removeClass('select');

  $(this).toggleClass("select");

});

$(".bt_slogan_portfolio").click(function () {
  $(".bt_slogan_portfolio").fadeOut();
});


$(".bt_slogan").click(function () {
  $(".bt_slogan_portfolio").fadeIn();
});

// Navbar Icon
function changeIcon(e) {
  const item = document.querySelector('[data-toggle-class]');
  item.className === "close-btn" ? item.className = "navbar-toggler-icon" : item.className = "close-btn";
}

$('.furniture_design_content .slider-for').slick({
  slidesToShow: 1,
  slidesToScroll: 1,
  arrows: false,
  fade: true,
  asNavFor: '.slider-nav'
});
$('.furniture_design_content .slider-nav').slick({
  slidesToShow: 3,
  slidesToScroll: 1,
  asNavFor: '.slider-for',
  focusOnSelect: true
});