$(document).ready(function () { //配置项 $("#fullpage").fullpage({ //可以为每一个section设置background-color属性 sectionsColor: ["green", "orange", "gray", "red", "yellow"], //定义是否通过箭头来控制slide幻灯片,默认为true。当我们设置为false,则幻灯片左右两则的箭头就会消失,在移动设备上,我们可以通过滑动来操作幻灯片 controlArrows: true, //每一页的内容是否垂直居中,默认为true.一般保持默认值 verticalCentered: true, //滚动速度,单位为毫秒,默认为700 scrollingSpeed: 1000, //定义锚连接,默认为[]。有了锚链接,用户就可以快速打开定位到某一页面 //注意定义锚链接的时候,值不要和页面中任意的id或name相同,尤其是在IE浏览器下。而且定义时不需要要加# // anchors: ["page1", "page2", "page3", "page4", "page5"], //是否锁定锚链接,默认为false。如果设置为true,那么定义的锚链接,也就是anchors属性则没有效果。这个配置项使用的比较少 lockAnchors: false, //定义页面section滚动的动画方式,如果修改此项,需要引入jquery.easings插件,或者jquery ui easing: "easeInOutCubic", //是否使用CSS3 transforms 来实现滚动效果,默认为true。这个配置项可以提高支持css3的浏览器,比如移动设备等的速度,如果浏览器不支持css3,则会使用jquery来替代css3实现滚动效果 css3: true, //滚动到最顶部后是否连续滚动到底部,默认为false loopTop: false, //滚动到最底部是否连续滚动回顶部,默认为false loopBottom: false, //横向slider幻灯片是否循环滚动,默认为true loopHorizontal: true, //是否使用插件的滚动方式,默认为true,如果选择false,则会出现浏览器自带的滚动条,将不会按页滚动,而是按照滚动条的默认行为来滚动 autoScrolling: true, //是否包含滚动条,默认为false,如果设置为true,则浏览器自带的滚动条出现,页面滚动时还是按页滚动,但是滚动条的默认行为也有效 scrollBar: false, //设置每一个section顶部和底部的padding,默认为0,一般如果需要设置一个固定顶部或者底部的菜单、导航、元素等,可以使用这两个配置项 paddingTop: 0, paddingBottom: 0, //固定的元素,默认为null,需要配置一个jquery选择器。在页面滚动的时候,fixedElements设置的元素固定不动 fixedElements: "", //是否可以使用键盘方向键导航,默认为true keyboardScrolling: true, //在移动设备中滑动页面的敏感性,默认为5,是按百分比来衡量,最高为100,越大则越难滑动 touchSensitivity: 5, //是否循环滚动,默认为false。如果设置为true,则页面会循环滚动,而不像loopTop或loopBottom那样出现跳动,注意这个属性和这两者不兼容,请不要同时使用 continuousVertical: false, //锚链接是否可以控制滚动动画,默认为true。如果设置为false,则通过锚链接定位到某个页面显示不再有动画效果 animateAnchor: true, //是否记录历史,默认为true,可以记录页面滚动的历史,通过浏览器的前进后退来导航。注意如果设置了autoScrolling:false,那么这个配置也将被关闭,即设置为false recordHistory: true, //绑定菜单,设定的相关属性与anchors的值对应后,菜单可以控制滚动,默认为false。可以设置为菜单的jquery选择器 menu: false, //是否显示导航,默认为false。如果设置为true,会显示小圆点,作为导航 navigation: true, //导航小圆点的位置,可以设置为left或者right navigationPosition: "right", //导航小圆点的tooltips设置,默认为[],注意按照顺序设置 // navigationTooltips: ["page1", "page2", "page3", "page4", "page5"], //是否显示当前页面的导航的tooltip信息,默认为false showActiveTooltip: true, //是否显示横向幻灯片的导航,默认为false slidesNavigation: true, //横向幻灯片导航的位置,默认为bottom,可以设置为top或bottom slidesNavPosition: "top", //内容超过满屏后是否显示滚动条,默认为false。如果设置为true,则会显示滚动条,如果滚动查看内容,还需要jquery.slimscroll插件的配合 scrollOverflow: false, //section的选择器,默认为.section sectionSelector: ".section", //slideSelector:slide的选择器,默认为.slide slideSelector: ".slide", }); // var mySwiper = new Swiper('.swiper-container', { // direction: 'horizontal', // 垂直切换选项 // loop: true, // 循环模式选项 // autoplay: true, //自动轮播 // // effect: 'fade', // // fadeEffect: { // // crossFade: true, // // }, // // effect: 'cube', // // cubeEffect: { // // slideShadows: true, // // shadow: true, // // shadowOffset: 100, // // shadowScale: 0.6 // // }, // // 如果需要分页器 // pagination: { // el: '.swiper-pagination', // }, // // 如果需要前进后退按钮 // navigation: { // nextEl: '.swiper-button-next', // prevEl: '.swiper-button-prev', // }, // // 如果需要滚动条 // // scrollbar: { // // el: '.swiper-scrollbar', // // }, // }) var swiperH = new Swiper('.swiper-container-h', { direction: 'horizontal', //loop: true, // 循环模式选项 //autoplay: true, //自动轮播 // delay: 9000, pagination: { el: '.swiper-pagination-h', }, navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev', }, spaceBetween: 50, on: { slideChangeTransitionEnd: function () { //alert(this.activeIndex); //切换结束时,告诉我现在是第几个slide var index = this.activeIndex; var $yewu = $('#tab_con1 .yewu'); var $wangluo = $('#tab_con1 .wangluo'); var $buding = $('#tab_con1 .buding'); var $yunwei = $('#tab_con1 .yunwei'); if (index == 0) { if ($wangluo.length != 0) { $.each($wangluo, function (index, item) { if ($(item).attr('class').indexOf('border') != -1) { $(item).removeClass('border') } }) } if ($buding.length != 0) { $.each($buding, function (index, item) { if ($(item).attr('class').indexOf('border') != -1) { $(item).removeClass('border') } }) } if ($yunwei.length != 0) { $.each($yunwei, function (index, item) { if ($(item).attr('class').indexOf('border') != -1) { $(item).removeClass('border') } }) } if ($yewu.length != 0) { $.each($yewu, function (index, item) { $(item).addClass('border') }) } } else if (index == 1) { if ($yewu.length != 0) { $.each($yewu, function (index, item) { if ($(item).attr('class').indexOf('border') != -1) { $(item).removeClass('border') } }) } if ($buding.length != 0) { $.each($buding, function (index, item) { if ($(item).attr('class').indexOf('border') != -1) { $(item).removeClass('border') } }) } if ($yunwei.length != 0) { $.each($yunwei, function (index, item) { if ($(item).attr('class').indexOf('border') != -1) { $(item).removeClass('border') } }) } if ($wangluo.length != 0) { $.each($wangluo, function (index, item) { $(item).addClass('border') }) } } else if (index == 2) { if ($yewu.length != 0) { $.each($yewu, function (index, item) { if ($(item).attr('class').indexOf('border') != -1) { $(item).removeClass('border') } }) } if ($wangluo.length != 0) { $.each($wangluo, function (index, item) { if ($(item).attr('class').indexOf('border') != -1) { $(item).removeClass('border') } }) } if ($yunwei.length != 0) { $.each($yunwei, function (index, item) { if ($(item).attr('class').indexOf('border') != -1) { $(item).removeClass('border') } }) } if ($buding.length != 0) { $.each($buding, function (index, item) { $(item).addClass('border') }) } } else if (index == 3) { // 综合运维 if ($yewu.length != 0) { $.each($yewu, function (index, item) { if ($(item).attr('class').indexOf('border') != -1) { $(item).removeClass('border') } }) } if ($wangluo.length != 0) { $.each($wangluo, function (index, item) { if ($(item).attr('class').indexOf('border') != -1) { $(item).removeClass('border') } }) } if ($buding.length != 0) { $.each($buding, function (index, item) { if ($(item).attr('class').indexOf('border') != -1) { $(item).removeClass('border') } }) } if ($yunwei.length != 0) { $.each($yunwei, function (index, item) { $(item).addClass('border') }) } } }, }, }); var swiperV1 = new Swiper('.swiper-container-v1', { direction: 'horizontal', pagination: { el: '.swiper-pagination-v', }, loop: true, // 循环模式选项 autoplay: true, //自动轮播 spaceBetween: 50 }); var swiperV2 = new Swiper('.swiper-container-v2', { direction: 'horizontal', pagination: { el: '.swiper-pagination-v', }, loop: true, // 循环模式选项 autoplay: true, //自动轮播 spaceBetween: 50 }); var swiperV3 = new Swiper('.swiper-container-v3', { direction: 'horizontal', pagination: { el: '.swiper-pagination-v', }, loop: true, // 循环模式选项 autoplay: true, //自动轮播 spaceBetween: 50 }); // 产品 var $slideComponentImg = $(".slide-component"); $slideComponentImg.each(function () { var target = $(this).children(".slide-component-img:eq(0)"); target.css('background', target.attr('data-src')); target.css('display', 'block'); }); $(".slide-component-ul").children("ul").children("li").click(function () { var index = $(this).index(); $(this).parent().children("li").removeClass('active'); $(this).addClass("active"); $(this).parent().parent().parent().children(".slide-component-img").hide(); var target = $(this).parent().parent().parent().children(".slide-component-img:eq(" + index + ")"); target.show(); }); // $("#tab_title1 li").click(function () { // var index = $(this).index(); // $(this).parent().children("li").removeClass('cur'); // $(this).addClass("cur"); // var $tance = $('#tab_con1 .tance'); // var $web_app = $('#tab_con1 .web_app'); // var $tcp = $('#tab_con1 .tcp'); // if (index == 0) { // if ($web_app.length != 0) { // $.each($web_app, function (index, item) { // if ($(item).attr('class').indexOf('border') != -1) { // $(item).removeClass('border') // } // }) // } // if ($tcp.length != 0) { // $.each($tcp, function (index, item) { // if ($(item).attr('class').indexOf('border') != -1) { // $(item).removeClass('border') // } // }) // } // if ($tance.length != 0) { // $.each($tance, function (index, item) { // $(item).addClass('border') // }) // } // } else if (index == 1) { // if ($tcp.length != 0) { // $.each($tcp, function (index, item) { // if ($(item).attr('class').indexOf('border') != -1) { // $(item).removeClass('border') // } // }) // } // if ($tance.length != 0) { // $.each($tance, function (index, item) { // if ($(item).attr('class').indexOf('border') != -1) { // $(item).removeClass('border') // } // }) // } // if ($web_app.length != 0) { // $.each($web_app, function (index, item) { // $(item).addClass('border') // }) // } // } else if (index == 2) { // if ($tance.length != 0) { // $.each($tance, function (index, item) { // if ($(item).attr('class').indexOf('border') != -1) { // $(item).removeClass('border') // } // }) // } // if ($web_app.length != 0) { // $.each($web_app, function (index, item) { // if ($(item).attr('class').indexOf('border') != -1) { // $(item).removeClass('border') // } // }) // } // if ($tcp.length != 0) { // $.each($tcp, function (index, item) { // $(item).addClass('border') // }) // } // } // }); // $("#tab_title2 li").click(function () { // var index = $(this).index(); // $(this).parent().children("li").removeClass('cur'); // $(this).addClass("cur"); // var $yewu = $('#tab_con2 .yewu'); // var $yunying = $('#tab_con2 .yunying'); // if (index == 0) { // if ($yunying.length != 0) { // $.each($yunying, function (index, item) { // if ($(item).attr('class').indexOf('border') != -1) { // $(item).removeClass('border') // } // }) // } // if ($yewu.length != 0) { // $.each($yewu, function (index, item) { // $(item).addClass('border') // }) // } // } else if (index == 1) { // if ($yewu.length != 0) { // $.each($yewu, function (index, item) { // if ($(item).attr('class').indexOf('border') != -1) { // $(item).removeClass('border') // } // }) // } // if ($yunying.length != 0) { // $.each($yunying, function (index, item) { // $(item).addClass('border') // }) // } // } // }); // $("#tab_title3 li").click(function () { // var index = $(this).index(); // $(this).parent().children("li").removeClass('cur'); // $(this).addClass("cur"); // var $caozuo = $('#tab_con3 .caozuo'); // var $gejie = $('#tab_con3 .gejie'); // var $zhishi = $('#tab_con3 .zhishi'); // if (index == 0) { // if ($gejie.length != 0) { // $.each($gejie, function (index, item) { // if ($(item).attr('class').indexOf('border') != -1) { // $(item).removeClass('border') // } // }) // } // if ($zhishi.length != 0) { // $.each($zhishi, function (index, item) { // if ($(item).attr('class').indexOf('border') != -1) { // $(item).removeClass('border') // } // }) // } // if ($caozuo.length != 0) { // $.each($caozuo, function (index, item) { // $(item).addClass('border') // }) // } // } else if (index == 1) { // if ($caozuo.length != 0) { // $.each($caozuo, function (index, item) { // if ($(item).attr('class').indexOf('border') != -1) { // $(item).removeClass('border') // } // }) // } // if ($zhishi.length != 0) { // $.each($zhishi, function (index, item) { // if ($(item).attr('class').indexOf('border') != -1) { // $(item).removeClass('border') // } // }) // } // if ($gejie.length != 0) { // $.each($gejie, function (index, item) { // $(item).addClass('border') // }) // } // } else if (index == 2) { // if ($gejie.length != 0) { // $.each($gejie, function (index, item) { // if ($(item).attr('class').indexOf('border') != -1) { // $(item).removeClass('border') // } // }) // } // if ($caozuo.length != 0) { // $.each($caozuo, function (index, item) { // if ($(item).attr('class').indexOf('border') != -1) { // $(item).removeClass('border') // } // }) // } // if ($zhishi.length != 0) { // $.each($zhishi, function (index, item) { // $(item).addClass('border') // }) // } // } // }); var rocketImgs = document.querySelectorAll('.rocket-wrapper img'); for (var i = 0; i < rocketImgs.length; i++) { rocketImgs[i].setAttribute('class', 'end'); } document.getElementById('rocket_body').style.animation = 'rocket_body 2s linear 2.2s infinite'; // document.getElementById('rocket_block_left_2').style = 'animation:rocket_block_left_2 3s linear 1s infinite'; // document.getElementById('rocket_block_right_1').style = 'animation:rocket_block_right_1 3s linear 1s infinite'; document.getElementById('rocket_halo_L').style.animation = 'rocket_halo_L 2s linear 2.2s infinite'; document.getElementById('rocket_halo_L_fadeout').style.animation = 'rocket_halo_L_fadeout 2s linear 2.2s infinite'; document.getElementById('rocket_tail_L').style.animation = 'rocket_tail_L 2s linear 2.2s infinite'; document.getElementById('rocket_tail_S').style.animation = 'rocket_tail_S 2s linear 2.2s infinite'; // document.getElementById('rocket_halo_S').style.animation = 'rocket_halo_S 2s linear 2.2s infinite'; document.getElementById('rocket_halo_XS').style.animation = 'rocket_halo_XS 2s linear 2.2s infinite'; document.getElementById('rocket_block_left_1').style.animation = 'rocket_block_left_1 4s linear 3.7s infinite'; // document.getElementById('rocket_block_right_2').style.animation = 'rocket_block_right_2 4s linear 3.7s infinite'; // 数字 var i = 0, j = 0, k = 0; var windowWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidht; var numberOne = document.getElementById('index_bg_number_1'); var numberTwo = document.getElementById('index_bg_number_2'); var numberThree = document.getElementById('index_bg_number_3'); var rocketTimer = setInterval(function () { i += 11, j += 1, k += 2; if (j < 72 && windowWidth > 821) { numberOne.innerHTML = i; numberTwo.innerHTML = j; numberThree.innerHTML = k; } else { numberOne.innerHTML = 180; numberTwo.innerHTML = 99.999; numberThree.innerHTML = 300; clearInterval(rocketTimer) } }, 13); }) //滚动条滚动时,导航固定 window.onscroll = function () { var dance = document.body.scrollTop || document.documentElement.scrollTop; //获取滚动条据顶部位置 if (dance > 0) { //距离大于0时设置固定在顶部样式fixed-top while (!document.getElementById("nav").className.match(/(?:^|\s)fixed-top(?!\S)/)) { //使用正则表达式判断导航栏class是否含有fixed-top document.getElementById("nav").className += " fixed-top"; //没有就设置,注意前面有空格并且是+=不然之前样式都会被替换成fixed-top; } } else { document.getElementById("nav").className = document.getElementById("nav").className.replace( /(?:^|\s)fixed-top(?!\S)/g, ''); //距离等于或小于0时,移除fixed-top } };