panda_web/assets/js/home/index.js

$(function () {
  //轮播图
  let swiper = new Swiper('#swiper1', {
    pagination: {
      el: '.swiper-pagination',
    },
    loop: true, //循环
    observer: true, //修改swiper自己或子元素时，自动初始化swiper
    observeParents: true, //修改swiper的父元素时，自动初始化swiper
    speed: 500,
    autoplay: {
      disableOnInteraction: false, //触碰后自动轮播也不会停止
      delay: 3000,
    },
  })

  $('.index-page .take-out .take-out-body .img-box1 .img-info').hover(
    function () {
      $('.index-page .take-out .take-out-body .img-box1 .take-out-img').fadeToggle()
      $('.index-page .take-out .take-out-body .img-box1').addClass('whiteColor')
      $('.index-page .take-out .take-out-body .img-box1 .img-info p').addClass('whiteColor')
    },
    function () {
      $('.index-page .take-out .take-out-body .img-box1 .take-out-img').fadeToggle()
      $('.index-page .take-out .take-out-body .img-box1').removeClass('whiteColor')
      $('.index-page .take-out .take-out-body .img-box1 .img-info p').removeClass('whiteColor')
    }
  )
  $('.index-page .take-out .take-out-body .img-box2 .img-info').hover(
    function () {
      $('.index-page .take-out .take-out-body .img-box2 .take-out-img').fadeToggle()
      $('.index-page .take-out .take-out-body .img-box2').addClass('whiteColor')
      $('.index-page .take-out .take-out-body .img-box2 .img-info p').addClass('whiteColor')
    },
    function () {
      $('.index-page .take-out .take-out-body .img-box2 .take-out-img').fadeToggle()
      $('.index-page .take-out .take-out-body .img-box2').removeClass('whiteColor')
      $('.index-page .take-out .take-out-body .img-box2 .img-info p').removeClass('whiteColor')
    }
  )
  $('.index-page .take-out .take-out-body .img-box3 .img-info').hover(
    function () {
      $('.index-page .take-out .take-out-body .img-box3 .take-out-img').fadeToggle()
      $('.index-page .take-out .take-out-body .img-box3').addClass('whiteColor')
      $('.index-page .take-out .take-out-body .img-box3 .img-info p').addClass('whiteColor')
    },
    function () {
      $('.index-page .take-out .take-out-body .img-box3 .take-out-img').fadeToggle()
      $('.index-page .take-out .take-out-body .img-box3').removeClass('whiteColor')
      $('.index-page .take-out .take-out-body .img-box3 .img-info p').removeClass('whiteColor')
    }
  )

  $('.index-page .map .select .select-btn').click(function () {
    $('.index-page .map .select .pull-box').fadeToggle()
  })

  let countrylist = [
    {
      name: '英国',
      enName: 'The United Kingdom',
    },
    {
      name: '美国',
      enName: 'The United States',
    },
    {
      name: '加拿大',
      enName: 'Canada',
    },
    {
      name: '法国',
      enName: 'France',
    },
    {
      name: '意大利',
      enName: 'Italy',
    },
    {
      name: '澳大利亚',
      enName: 'Australia',
    },
    {
      name: '新西兰',
      enName: 'New Zealand',
    },
    {
      name: '日本',
      enName: 'Japan',
    },
    {
      name: '韩国',
      enName: 'South Korea',
    },
    {
      name: '新加坡',
      enName: 'Singapore',
    },
  ]
  country(countrylist, '#map')
  function country(data, el) {
    $.each(data, function (index, value) {
      let ele = $(`<div class="country-address">
      <span>${value.enName}</span>
      <div class="big-circle">
        <div class="smail-circle">
          <div class="circle"></div>
        </div>
      </div>
    </div>`)
      $(el).append(ele)
    })
  }
})