suzhou/js/index.js

(function($){
  $.fn.numberRock=function(options){
      var defaults={
          lastNumber:100,
          duration:3000,
          easing:'swing'  //swing(默认 : 缓冲 : 慢快慢)  linear(匀速的)
      };
      var opts=$.extend({}, defaults, options);

      $(this).animate({
          num : "numberRock",

      },{
          duration : opts.duration,
          easing : opts.easing,
          complete : function(){
              // console.log("success");
          },
          step : function(a,b){

              $(this).html(parseInt(b.pos * opts.lastNumber));
          }
      });
  }


})(jQuery);
//banner
$(function(){
  //判断是否在可视区内部
  function isVisible(selectid) {
    console.log(selectid)
    var o;
    if ('object' === typeof selectid) {
      o = selectid;
    } else {
      o = $(selectid);
    }
    var of = o.offset();
    var w = $(window);
    return !(w.scrollTop() > (of.top + o.outerHeight()) || (w.scrollTop() + w.height()) < of.top);
  }
   
$('.index_banner').slick({
    autoplay: true, 
    arrows: false,
    dots:false,
    infinite: true,
    speed: 500,
    autoplaySpeed: 1000,
    pauseOnHover: false,
    fade: true,
    responsive: [
      {
        breakpoint: 992,
        settings: {
          dots: true
        }
      }
    ]
});
$('.brand__slider').owlCarousel({
  loop:true,
  margin:30,
  autoplay:false,
  autoplayTimeout:3000,
  smartSpeed:500,
  items:3,
  navText:['<button><i class="fal fa-angle-left"></i></button>','<button><i class="fal fa-angle-right"></i></button>'],
  nav:false,
  dots:false,
  responsive:{
    0:{
      items:1
    },
    576:{
      items:2
    },
    767:{
      items:3
    },
  }
});

$($('.electricItem>button')[0]).css('display','block')
$($('.electricItem>.addIon')[0]).css('display','none')
$($('.electricItem')[0]).css('background','rgba(19,75,161,0.8)')
$('.electricItem').mouseenter(function(){
    // console.log($(this).parent().siblings().children().children('.addIon'))
    $(this).css('background','rgba(19,75,161,0.8)')
    $(this).parent().siblings().children().css('background','transparent center top no-repeat')
    $($(this).children()[3]).css('display','none')
    $($(this).children()[2]).css('display','block')
    $($(this).parent().siblings().children().children('button')).css('display','none')
    $($(this).parent().siblings().children().children('.addIon')).css('display','block')
    $('.section3').css ('transition', '1s')
    if($(this).children()[1].innerText=='先进材料'){
        $('.section3').css ('background','url(images/先进材料-bg.jpg) center top no-repeat')
        $('.second3Title>.title')[0].innerText = '先进材料'
        $('.second3Title>p')[0].innerHTML = 'ADVANCED<br>MATERIALS'
        $('.second3Title>.textsecond3')[0].innerHTML = '重点关注先进钢铁材料、先进有色金属材料、先进石化化工新材料、先进无机非金属材料、高性能纤维及制品和复合材料、前沿新材料等领域'
    }
    if($(this).children()[1].innerText=='装备制造'){
        $('.second3Title>.title')[0].innerText = '装备制造'
        $('.section3').css ('background','url(images/装备制造-bg.jpg) center top no-repeat','border')
        $('.second3Title>.title')[0].innerText = '装备制造'
        $('.second3Title>p')[0].innerHTML = 'EQUIPMENT<br>MAFUFACTURING'
        $('.second3Title>.textsecond3')[0].innerHTML = '重点关注高端装备、新能源、汽车及零部件、航空航天等领域'
    }
    if($(this).children()[1].innerText=='电子信息'){
        $('.second3Title>.title')[0].innerText = '电子信息'
        $('.section3').css ('background','url(images/电子信息-bg.jpg) center top no-repeat')
        $('.second3Title>.title')[0].innerText = '电子信息'
        $('.second3Title>p')[0].innerHTML = 'ELECTRONIC<br>INFORMATION'
        $('.second3Title>.textsecond3')[0].innerHTML = '重点关注计算机与智能消费设备制造、信息通信、新型显示、集成电路、电子元器件与专用材料产业、人工智能等领域'
    }
    if($(this).children()[1].innerText=='医药生物'){
        $('.second3Title>.title')[0].innerText = '医药生物'
        $('.section3').css ('background','url(images/医药生物-bg.jpg) center top no-repeat')
        $('.second3Title>.title')[0].innerText = '医药生物'
        $('.second3Title>p')[0].innerHTML = 'PHARMACEUTICAL<br>BIOLOGY'
        $('.second3Title>.textsecond3')[0].innerHTML = '重点关注创新医药、高端医疗器械、CXO（合同研发生产组织）、BT（生物技术）+IT（信息技术）融合、产业链配套、商贸供应链、医'
    }
})

$('.index_banner').init(function(slick){
    $('.index_banner .item.slick-current').addClass('active').siblings().removeClass('active')
})
$('.index_banner').on('afterChange',function(slick,currentSlide){
    $('.index_banner .item.slick-current').addClass('active').siblings().removeClass('active');
    var _index = $('.index_banner').slick('slickCurrentSlide')
    $('.section1 .number span').eq(_index).addClass('active').siblings().removeClass('active')
})
$('.section1 .number span').click(function(){
    var _index = $(this).index();
    $('.index_banner').slick('slickGoTo',_index);
    $(this).addClass("active").siblings().removeClass("active")
});
$('.section1 .prev').click(function(){
  $('.index_banner').slick('slickPrev')
})
$('.section1 .next').click(function(){
  $('.index_banner').slick('slickNext');
});

//导航
//超过一定高度导航添加类名
var nav=$("header"); //得到导航对象  
var win=$(window); //得到窗口对象  
var sc=$(document);//得到document文档对象。  
win.scroll(function(){ 
  // if(sc.scrollTop()>=100){  
  //   nav.addClass("on");   
  // }else{  
  //  nav.removeClass("on");  
  // }  
})
//移动端展开nav
$('#navToggle').on('click',function(){
	$('.m_nav').addClass('open');
})
//关闭nav
$('.m_nav .top .closed').on('click',function(){
	$('.m_nav').removeClass('open');
})

//二级导航  移动端
$(".m_nav .ul li").click(function() {
	$(this).children("div.dropdown_menu").slideToggle('slow')
    $(this).siblings('li').children('.dropdown_menu').slideUp('slow');				
});
// 流动效果
function groupSlide(){
  imgScroll.rolling({
    name:'g1',
    width:'198px',
    height:'116px',
    direction:'left',
    speed:10,
    addcss:true
  });
  imgScroll.rolling({
    name:'g2',
    width:'198px',
    height:'116px',
    direction:'right',
    speed:10,
    addcss:true
  });
  imgScroll.rolling({
    name:'g3',
    width:'198px',
    height:'116px',
    direction:'left',
    speed:10,
    addcss:true
  });
}
groupSlide()
//全屏滚动
$('#index_main').fullpage({
	'navigation': true,
  scrollBar: false,
	slidesNavigation: true,
  css3: true,
	controlArrows: false,
	continuousHorizontal:true,
	scrollingSpeed:500,
	showActiveTooltip :true, 
	anchors: ['hero', 'one', 'two', 'three','four','five'],
	loopHorizontal: true,
	afterLoad: function(anchorLink, index){
    console.log(index)
    if(index == 1){
			$('header').removeClass('on').addClass("animation");
		}
		if(index == 2){
			$('header').addClass('on').addClass("animation");
      
      var _txt1 = $(".number1").attr('data-val');
      var _txt2 = $(".number2").attr('data-val');
      var _txt3 = $(".number3").attr('data-val');
      $(".number1").numberRock({
          lastNumber:_txt1,
          duration:2000,
          easing:'swing',
      });
      $(".number2").numberRock({
          lastNumber:_txt2,
          duration:2000,
          easing:'swing',
      });
      $(".number3").numberRock({
          lastNumber:_txt3,
          duration:2000,
          easing:'swing',
      });
		}
    if(index == 3){
			$('header').removeClass('on').addClass("animation");
		}
    if(index == 4){
			$('header').addClass('on').addClass("animation");
		}
    if(index == 5){
			$('header').removeClass('on').addClass("animation");
		}
    if(index == 6){
			$('header').addClass('on').addClass("animation");
		}
    // var wow = new WOW({
    //   boxClass: 'wow',
    //   animateClass: 'animated',
    //   offset: 0,
    //   mobile: true,
    //   live: true
    // });
    // wow.init();
	},
  afterSlideLoad:function(){
  },
  afterRender: function(){
	},
	onLeave: function(index, direction){
    if(index === 1){
      $(".header").removeClass("animation");
    }else if(index==2){
      $(".number1")[0].innerHTML = 0
      $(".number2")[0].innerHTML = 0
      $(".number3")[0].innerHTML = 0;
      $(".header").removeClass("animation");
    }else{
      $(".header").removeClass("animation");
    }
	}
})
})