$(function () {
  //加载动画
  if (__m.cssanimations) {
      new kyanimate().init();
  } else {
      $('.ky'), css("visibility", "visible");
  }
  $('.headernav').hover(
      function () {
          let this_ = $(this);
          this_.children().eq(0).addclass("header_nav_red");
          this_.children('.menu').stop().slidedown(500);
      },
      function () {
          let this_ = $(this);
          this_.children().eq(0).removeclass("header_nav_red");
          // console.log($(this).index());
          this_.children('.menu').stop().hide();
      }
  )
    $(".menu .box-right .list .item").hover(
        function () {
            var index = $(this).index();
            $(".menu .box-right .list .item-bg").css({
                'top': index * 0.525 + 'rem'
            });
        },
        function () {
            $(".menu .box-right .list .item-bg").css({
                'top': '-0.525rem'
            });
        }
    );
    $('.language-box').hover(
      function () {
          let $this = $(this);
          $this.children('.down-box').stop(true, false).slidedown(500);
      },
      function () {
          let $this = $(this);
          $this.children('.down-box').stop(true, false).slideup(200);
      }
  )
  $('.links .text-show').click(function () {
    $('.links .link').stop(false, true).slidetoggle(388);
})
$__w.click(function (e) {
    $this = $(e.target);
    if (!$(".links .link").is(":hidden") && !$this.hasclass("text-show") && !$this.hasclass("text") && !$this.hasclass("icon")) {
        $(".links .link").stop(false, true).hide(388, "easeinquart");
    }
});
  //pcheader搜索框
  $('.glass').on('click', function () {
      $('.search_box').slidedown(500);
  })
  $('.close').on('click', function () {
      $('.search_box').slideup(500);
  })
  //m_herader样式
  var flag = false;
  $('#menus').on('click', function () {
      if (!flag) {
          $('#menus').removeclass("fa-bars").addclass("fa-times");
          $('.mhead_li').slidedown()
          flag = true;
      } else {
          $('#menus').removeclass("fa-times").addclass("fa-bars");
          $('.mhead_li').slideup()
          flag = false;
      }
  })
  $('.li_left li').on('click', function () {
      let index = $(this).index();
      $(this).addclass('li_active').siblings().removeclass('li_active');
      $('.li_right>ul').eq(index).addclass("ul_active").siblings().removeclass("ul_active")
  })
  //手机搜索框
  $('#search').on('click', function () {
      $('.m_search').slidedown(200);
  })
  $('.m_close').on('click', function () {
      $('.m_search').slideup(200);
  })
  //m_footer
  $('.foot').on('click', function () {
      let this_ = $(this);
      // console.log(this_.siblings('ul'));
      this_.children('ul').slidetoggle();
      this_.find('i').toggleclass("i_rotate");
  })


  $(window).scroll(function () {
    var bei = $('.list-banner');
    var nav = $('.detail-nav');
    var header = $('.header_p').outerheight();
    var mhreader = $('.header_m').outerheight();
    var shreader = $('.serve').outerheight();
    var ptop = $('.product').offset().top;
    var p1top = $('.photo').offset().top;
    var ctop = $('.case').offset().top;
    var nheight = nav.outerheight();
    var beipos = bei.outerheight();
    var top = $(document).scrolltop();
    var li = $('.detail-nav .left ul li');
    if(top > ptop - nheight - header){
        li.eq(0).addclass('active');
        li.eq(0).siblings().removeclass('active');
    }
    if(top > p1top - nheight - header){
        li.eq(1).addclass('active');
        li.eq(1).siblings().removeclass('active')
    }
    if(top > ctop - nheight - header){
        li.eq(2).addclass('active');
        li.eq(2).siblings().removeclass('active')
    }
    if($(window).width() > 1004){
        if (top >= beipos + shreader) {
            if (nav.css("position") == "relative") {
              nav.css({
                'position':'fixed',
                'top':header - 1
              });
              if(!nav.hasclass('top')){
                  nav.addclass('top')
              }
              $('.bei').show();
              $('.bei').addclass('top')
            }
          }else{
            if (nav.css("position") == "fixed") {
              nav.css({
                'position':'relative',
                'top':'0'
              });
              if(nav.hasclass('top')){
                  nav.removeclass('top')
              }
              $('.bei').hide();
              $('.bei').removeclass('top')
            }
          }
    }else{
        if (top >= beipos + shreader) {
            if (nav.css("position") == "relative") {
              nav.css({
                'position':'fixed',
                'top':mhreader - 1
              });
              if(!nav.hasclass('top')){
                  nav.addclass('top')
              }
              $('.bei').show();
            }
          }else{
            if (nav.css("position") == "fixed") {
              nav.css({
                'position':'relative',
                'top':'0'
              });
              if(nav.hasclass('top')){
                  nav.removeclass('top')
              }
              $('.bei').hide();
            }
          }
    }
  })


  $(".list .item .top").click(function(){
    $this = $(this);
    $this.parent('.item').children('.bottom').stop(true,true).slidetoggle();
    $this.find('.open').toggleclass('active');
    $this.find('.close').toggleclass('active');
  })
    if ($(window).width()>1004) {
        $('.detail-nav .left ul li').eq(0).click(function(){
            var hheight = $('.header_p').outerheight();
            var nheight = $('.detail-nav').outerheight();
            var target_top = $("#product").offset().top - hheight - nheight - 30;
            $("html,body").animate({scrolltop: target_top}, 1000);
            $(this).addclass('active');
            $(this).siblings().removeclass('active')
        })
        $('.detail-nav .left ul li').eq(1).click(function(){
            var hheight = $('.header_p').outerheight();
            var nheight = $('.detail-nav').outerheight();
            var target_top = $("#photo").offset().top - hheight - nheight;
            $("html,body").animate({scrolltop: target_top}, 1000);
            $(this).addclass('active');
            $(this).siblings().removeclass('active')
        })
        $('.detail-nav .left ul li').eq(2).click(function(){
            var hheight = $('.header_p').outerheight();
            var nheight = $('.detail-nav').outerheight();
            var target_top = $("#case").offset().top - hheight - nheight;
            $("html,body").animate({scrolltop: target_top}, 1000);
            $(this).addclass('active');
            $(this).siblings().removeclass('active')
        })
    } else {
        $('.detail-nav .left ul li').eq(0).click(function(){
            var hheight = $('.header_m').outerheight();
            var nheight = $('.detail-nav').outerheight();
            var target_top = $("#product").offset().top - hheight - nheight - 10;
            $("html,body").animate({scrolltop: target_top}, 1000);
            $(this).addclass('active');
            $(this).siblings().removeclass('active')
        })
        $('.detail-nav .left ul li').eq(1).click(function(){
            var hheight = $('.header_m').outerheight();
            var nheight = $('.detail-nav').outerheight();
            var target_top = $("#photo").offset().top - hheight - nheight + 2;
            $("html,body").animate({scrolltop: target_top}, 1000);
            $(this).addclass('active');
            $(this).siblings().removeclass('active')
        })
        $('.detail-nav .left ul li').eq(2).click(function(){
            var hheight = $('.header_m').outerheight();
            var nheight = $('.detail-nav').outerheight();
            var target_top = $("#case").offset().top - hheight - nheight + 2;
            $("html,body").animate({scrolltop: target_top}, 1000);
            $(this).addclass('active');
            $(this).siblings().removeclass('active')
        })
    }




   var myswiper1 = new swiper ('.swiper1', {
    direction: 'horizontal', // 垂直切换选项
    loop: true, // 循环模式选项
    slidesperview : 2,
    spacebetween : '3.009%',
    // 如果需要分页器
    pagination: {
      el: '.swiper-pagination1',
      type : 'progressbar',
    },
    
    // 如果需要前进后退按钮
    navigation: {
      nextel: '.swiper-button-next1',
      prevel: '.swiper-button-prev1',
    },
    breakpointsbase: 'container',
    breakpoints: {
        320: { //当屏幕宽度大于等于320
          slidesperview: 1,
          spacebetween: 10
        },
        1004: { //当屏幕宽度大于等于1280
          slidesperview: 2,
          spacebetween : '3.009%',
        },
      }
  })  
  var myswiper2 = new swiper ('.swiper2', {
    direction: 'horizontal', // 垂直切换选项
    loop: true, // 循环模式选项
    speed:1000,
    // 如果需要前进后退按钮
    navigation: {
      nextel: '.swiper-button-next2',
      prevel: '.swiper-button-prev2',
    },
  })
  $('.photo .content .swiper1 .swiper-slide').on("click",function () {
        $('.popups1').fadein(300);
        top = $(window).scrolltop();
        var num = $(this).data('num');
        myswiper2.slideto(num,0,true);
        $('body').css("top", -top + "px");
        $('body').addclass('fixed');
    })
    $('body').on("click",'.popups1 .close',function () {
        $('.popups1').fadeout(300);
        $('body').removeclass('fixed');
        $('body').removeattr("style");
        $(window).scrolltop(top);
    })

    var myswiper3 = new swiper ('.swiper3', {
        direction: 'horizontal', // 垂直切换选项
        loop: true, // 循环模式选项
        speed:1000,
        // 如果需要前进后退按钮
        navigation: {
            nextel: '.swiper-button-next3',
            prevel: '.swiper-button-prev3',
        },
        on:{
            init: function(){
              swiperanimatecache(this); //隐藏动画元素 
              swiperanimate(this); //初始化完成开始动画
            }, 
            slidechangetransitionend: function(){ 
              swiperanimate(this); //每个slide切换结束时也运行当前slide动画
              //this.slides.eq(this.activeindex).find('.ani').removeclass('ani'); 动画只展现一次，去除ani类名
            } 
        }
    })  
})