1516 lines
39 KiB
JavaScript
1516 lines
39 KiB
JavaScript
|
||
|
||
$(function(){
|
||
|
||
|
||
|
||
// 防抖方法
|
||
function AntiShake(fn,wait){
|
||
var timer = null;
|
||
return function(){
|
||
if(timer !== null){
|
||
clearTimeout(timer);
|
||
}
|
||
timer = setTimeout(fn,wait);
|
||
};
|
||
}
|
||
|
||
AntiShake(onResize, 200);
|
||
$(window).resize(AntiShake(onResize, 100));
|
||
|
||
AntiShake(onScroll, 200);
|
||
$(window).scroll(AntiShake(onScroll, 100));
|
||
|
||
//wow调用
|
||
if (typeof WOW != 'undefined') {
|
||
var wow = new WOW({
|
||
boxClass: 'wow',
|
||
animateClass: 'animated',
|
||
offset: 0,
|
||
mobile: true,
|
||
live: true
|
||
});
|
||
wow.init();
|
||
}
|
||
|
||
//弹出视频播放器
|
||
$('.videoBtn').on('click',function(){
|
||
var url = $(this).attr('rel');
|
||
if(url.indexOf('http') == 0){
|
||
$('.videoPlayer').html('<iframe frameborder="0" src="'+ url +'" allowFullScreen="true"></iframe>');
|
||
} else {
|
||
$('.videoPlayer').html('<video src="'+ url +'" controls preload="" muted="" x-webkit-airplay="true" airplay="allow" webkit-playsinline="true" playsinline="true" x5-video-player-fullscreen="true" x5-video-player-type="h5" x5-video-orientation="portraint"></video>');
|
||
}
|
||
$('.PopupVideoBox').fadeIn(200);
|
||
});
|
||
|
||
//关闭弹出播放器
|
||
$('.closeVideo').on('click', function(){
|
||
$('.PopupVideoBox').fadeOut(200);
|
||
$('.videoPlayer').html('');
|
||
});
|
||
|
||
|
||
//swiper方法调用
|
||
if(typeof Swiper != 'undefined') {
|
||
//首页banner
|
||
var defaBanner = new Swiper('.defaBanner', {
|
||
paginationClickable: true,
|
||
loop:true,
|
||
autoplay:4500,
|
||
autoplayDisableOnInteraction : false,
|
||
nextButton: '.defaBannerNext',
|
||
prevButton: '.defaBannerPrev',
|
||
pagination : '.defaBannerdot',
|
||
onInit: function(swiper){
|
||
|
||
},
|
||
onTransitionEnd: function(swiper){
|
||
|
||
}
|
||
});
|
||
//二级栏目适应内容区
|
||
var defaSecondLevelColumn = new Swiper('.defaSecondLevelColumn', {
|
||
paginationClickable: true,
|
||
slidesPerView:"auto",
|
||
spaceBetween:0,
|
||
autoplayDisableOnInteraction : false,
|
||
});
|
||
}
|
||
|
||
// 页面监听窗口
|
||
function onResize(){
|
||
if($(window).innerWidth() > 1259){
|
||
$('html').removeClass('hideScroll');
|
||
$('.defaSearch span').removeClass('closeSearchbox');
|
||
$('.defanav ul li p, .defanav, .defaSearchbox,.defaLanguage p').removeAttr('style');
|
||
}
|
||
}
|
||
|
||
//滚动条监听
|
||
function onScroll(){
|
||
var scrollTop = $(window).scrollTop();
|
||
if(scrollTop > $('.header').height()){
|
||
$('.defaheader').addClass('defaheaderbg');
|
||
} else {
|
||
$('.defaheader').removeClass('defaheaderbg');
|
||
}
|
||
}
|
||
|
||
//其他事件
|
||
|
||
$('.defaheader').hover(function(){
|
||
$(this).addClass('defaheaderbg');
|
||
},function(){
|
||
if($(window).scrollTop() < $('.defaheader').height()){
|
||
$(this).removeClass('defaheaderbg');
|
||
}
|
||
});
|
||
|
||
$('.defanav ul li i').on('click',function(){
|
||
if($(this).next().is(':hidden')){
|
||
$(this).parent().siblings().find('p').slideUp(200);
|
||
$(this).parent().siblings().removeClass('cur');
|
||
$(this).next().slideDown(200);
|
||
$(this).parent().addClass('cur');
|
||
|
||
} else {
|
||
$(this).next().slideUp(200);
|
||
$(this).parent().removeClass('cur');
|
||
}
|
||
});
|
||
|
||
$('.defanavbtn').on('click',function(){
|
||
if($('.defanav').is(':hidden')){
|
||
$(this).addClass('defacloseNavbtn');
|
||
$('.defanav').slideDown(200);
|
||
$('html').addClass('hideScroll');
|
||
$('.defaSearchbox').hide();
|
||
$('.defaSearch span').removeClass('closeSearchbox');
|
||
$('.defaLanguage p').hide();
|
||
} else {
|
||
$(this).removeClass('defacloseNavbtn');
|
||
$('.defanav').slideUp(200);
|
||
$('html').removeClass('hideScroll');
|
||
}
|
||
});
|
||
|
||
$('.defaSearch span').on('click', function(){
|
||
if(window.innerWidth < 1260){
|
||
if($(this).next().is(':hidden')){
|
||
$(this).addClass('closeSearchbox');
|
||
$(this).next().slideDown(200);
|
||
$('.defanav').hide();
|
||
$('.defanavbtn').removeClass('defacloseNavbtn');
|
||
$('.defaLanguage p').hide();
|
||
} else {
|
||
$(this).removeClass('closeSearchbox');
|
||
$(this).next().slideUp(200);
|
||
}
|
||
}
|
||
});
|
||
|
||
$('.defaLanguage span').on('click', function(){
|
||
if(window.innerWidth < 1260){
|
||
if($(this).next().is(':hidden')){
|
||
$(this).addClass('closeSearchbox');
|
||
$(this).next().slideDown(200);
|
||
$('.defanav').hide();
|
||
$('.defanavbtn').removeClass('defacloseNavbtn');
|
||
$('.defaSearchbox').hide();
|
||
$('.defaSearch span').removeClass('closeSearchbox');
|
||
} else {
|
||
$(this).removeClass('closeSearchbox');
|
||
$(this).next().slideUp(200);
|
||
}
|
||
}
|
||
});
|
||
|
||
// //省市区选择器
|
||
// if (returnCitySN) {
|
||
// $('#ThreeLevelLinkage').citys({
|
||
// code: returnCitySN['cid'],
|
||
// crossDomain: true,
|
||
// province:440000,
|
||
// city:440300,
|
||
// area:440304,
|
||
// });
|
||
// $('.ChooseCity').select2({
|
||
// language: {
|
||
// noResults: function(params) {
|
||
// return "暂无数据";
|
||
// }
|
||
// },
|
||
// minimumResultsForSearch: Infinity
|
||
// });
|
||
// }
|
||
|
||
// //单项选择器
|
||
// $('.individual').select2({
|
||
// language: {
|
||
// noResults: function(params) {
|
||
// return "暂无数据";
|
||
// }
|
||
// },
|
||
// minimumResultsForSearch: Infinity
|
||
// });
|
||
|
||
if ($("#grid").length > 0) {
|
||
int();
|
||
function int(){
|
||
new AnimOnScroll(document.getElementById('grid'), {
|
||
minDuration: 0.4,
|
||
maxDuration: 0.7,
|
||
viewportFactor: 0.2
|
||
});
|
||
}
|
||
$('.WaterfallFlowMore').on('click',function(){
|
||
var html = ' <li><a href="javascript:;"><img src="dist/images/defaImg01.jpg"><div class="FlowContent"><p class="time">2020.10.13</p><h3>1从路人甲到C位咖，完美就要这么“妆”！</h3><p class="desc">作为社会人，每个人都要与他人往来和接触，总有见一面的时候，总会产生或好或坏的第一印象，就第一印象而言，谁都只有一次机会...</p></div></a></li><li><a href="javascript:;"><img src="dist/images/defaImg02.jpg"><div class="FlowContent"><p class="time">2020.10.13</p><h3>2从路人甲到C位咖，完美就要这么“妆”！</h3><p class="desc">作为社会人，每个人都要与他人往来和接触，总有见一面的时候，总会产生或好或坏的第一印象，就第一印象而言，谁都只有一次机会...</p></div></a></li>';
|
||
$('.WaterfallFlow ul').append(html);
|
||
int();
|
||
});
|
||
}
|
||
|
||
});
|
||
|
||
$(function () {
|
||
//swiper方法调用
|
||
if (typeof Swiper != 'undefined') {
|
||
|
||
var index_swiper = new Swiper('.index_swiper', {
|
||
speed: 600,
|
||
autoplay: 6000,
|
||
autoplayDisableOnInteraction: false,
|
||
paginationClickable: true,
|
||
pagination: '.insw_pagination',
|
||
noSwiping: true,
|
||
loop:true,
|
||
prevButton: '.index_prev',
|
||
nextButton: '.index_next',
|
||
autoHeight: true,
|
||
onInit: function (swiper) {
|
||
TVideo(swiper);
|
||
},
|
||
onSlideChangeEnd: function (swiper) {
|
||
TVideo(swiper);
|
||
}
|
||
});
|
||
|
||
function TVideo(abj) {
|
||
|
||
var Video = $(".index_swiper .swiper-slide-active video").get(0)
|
||
if ($(".index_swiper .swiper-slide-active").find("video").length > 0) {
|
||
Video.play();
|
||
abj.stopAutoplay();
|
||
Video.addEventListener('ended', function () {
|
||
abj.startAutoplay();
|
||
})
|
||
}
|
||
}
|
||
|
||
$(".swiper_off i").click(function () {
|
||
if ($(this).hasClass("cur")) {
|
||
$(this).removeClass("cur")
|
||
index_swiper.startAutoplay();
|
||
$(this).addClass("icon_stop").removeClass("icon_bofang2");
|
||
} else {
|
||
$(this).addClass("cur")
|
||
index_swiper.stopAutoplay();
|
||
$(this).addClass("icon_bofang2").removeClass("icon_stop");
|
||
}
|
||
});
|
||
var inproduct_swiper = new Swiper('.inproduct_swiper', {
|
||
speed: 600,
|
||
// pagination: '.inpro_pagination',
|
||
scrollbarDraggable: true,
|
||
paginationType: 'progress',
|
||
slidesPerView: 2,
|
||
slidesPerColumn: 2,
|
||
paginationClickable: true,
|
||
scrollbar: '.inproduct_scrollbar',
|
||
scrollbarHide: false,
|
||
spaceBetween: 60,
|
||
breakpoints: {
|
||
1600:{
|
||
spaceBetween: 30,
|
||
},
|
||
992: {
|
||
spaceBetween: 20,
|
||
},
|
||
580: {
|
||
spaceBetween: 10,
|
||
slidesPerView: 1,
|
||
}
|
||
}
|
||
});
|
||
|
||
// var purpose_tabSwiper3;
|
||
var purpose_swiper;
|
||
// purpose_tabSwiper3 = new Swiper('.purpose_tabSwiper3', {
|
||
// slidesPerView:8,
|
||
// spaceBetween: 30,
|
||
// breakpoints:{
|
||
// 992: {
|
||
// spaceBetween: 5,
|
||
// },
|
||
// 765: {
|
||
// slidesPerView: 3,
|
||
// },
|
||
// 465: {
|
||
// slidesPerView:2,
|
||
// },
|
||
// }
|
||
// });
|
||
|
||
// purpose_contswiper = new Swiper('.purpose_contswiper', {
|
||
// speed: 600,
|
||
// onSlideChangeStart: function (swiper) {
|
||
// purpose_swiper.slideTo(swiper.activeIndex, 1000, false);
|
||
// $(".purpose_tab .swiper-slide").eq(swiper.activeIndex).addClass("active").siblings().removeClass("active");
|
||
// purpose_tabSwiper3.slideTo(swiper.activeIndex, 1000, false);
|
||
|
||
// }
|
||
// });
|
||
purpose_swiper = new Swiper('.purpose_swiper', {
|
||
speed: 600,
|
||
onSlideChangeStart: function (swiper) {
|
||
// purpose_contswiper.slideTo(swiper.activeIndex, 1000, false);
|
||
$(".purpose_tab .item").eq(swiper.activeIndex).addClass("active").siblings().removeClass("active");
|
||
// purpose_tabSwiper3.slideTo(swiper.activeIndex, 1000, false);
|
||
$(".home3TabItem").eq(swiper.activeIndex).show().addClass("active").siblings().hide().removeClass("active");
|
||
}
|
||
|
||
});
|
||
|
||
|
||
|
||
$(".home3TabItem").eq(0).show();
|
||
$(".purpose_tab .item").click(function () {
|
||
var index = $(this).index();
|
||
$(this).addClass("active").siblings().removeClass("active");
|
||
$(".home3TabItem").eq(index).show().addClass("active").siblings().hide().removeClass("active");
|
||
purpose_swiper.slideTo(index, 1000, false);
|
||
});
|
||
$(".purpose_prev").click(function () {
|
||
purpose_swiper.slidePrev();
|
||
});
|
||
$(".purpose_next").click(function () {
|
||
purpose_swiper.slideNext();
|
||
});
|
||
var incase_swiper1 = new Swiper('.incase_swiper1', {
|
||
speed: 600,
|
||
onSlideChangeStart: function (swiper) {
|
||
$(".incase_tablist .item").eq(swiper.activeIndex).addClass("active").siblings().removeClass("active");
|
||
}
|
||
});
|
||
var incase_swiper2 = new Swiper('.incase_swiper2', {
|
||
speed: 600,
|
||
observer:true,
|
||
observeParents:true,
|
||
onSlideChangeStart: function (swiper) {
|
||
$(".incase_tablist .item").eq(swiper.activeIndex).addClass("active").siblings().removeClass("active");
|
||
}
|
||
});
|
||
|
||
$(".incase_tablist .item").hover(function () {
|
||
var index = $(this).index();
|
||
$(this).addClass("active").siblings().removeClass("active")
|
||
if ($(".incase_swiper").length > 1) {
|
||
incase_swiper1.slideTo(index, 1000, false);
|
||
incase_swiper2.slideTo(index, 1000, false);
|
||
}
|
||
});
|
||
|
||
}
|
||
|
||
$(".hsearch_btn").click(function () {
|
||
if (!$(this).hasClass("active")) {
|
||
$(this).addClass("active")
|
||
$("#search-form").css({
|
||
"max-height": "60px"
|
||
});
|
||
} else {
|
||
$(this).removeClass("active")
|
||
$("#search-form").css({
|
||
"max-height": "0"
|
||
});
|
||
}
|
||
});
|
||
|
||
|
||
$(window).scroll(function () {
|
||
scrollEvent();
|
||
var TopLi = $(window).scrollTop() + 300
|
||
$(".Solution_XQ .box").each(function(){
|
||
var num = $(this).index()
|
||
var _this = $(this).offset().top
|
||
if(TopLi >= _this){
|
||
$(".AnchorLocation .con .li").eq(num).addClass("active").siblings().removeClass("active")
|
||
}
|
||
})
|
||
});
|
||
|
||
function scrollEvent() {
|
||
var scrollT = $(window).scrollTop();
|
||
if (scrollT > 600) {
|
||
$("#ScrollTop").addClass("active")
|
||
$('.cebian').stop().addClass("active");
|
||
} else {
|
||
$("#ScrollTop").removeClass("active");
|
||
$('.cebian').stop().removeClass("active");
|
||
}
|
||
|
||
}
|
||
|
||
$(".navmenu_div").click(function () {
|
||
if (!$(this).hasClass("closeNavbtn")) {
|
||
$(".head_navlist").stop().slideDown();
|
||
$(this).addClass("closeNavbtn");
|
||
$(".header").addClass("header_active");
|
||
$("body").css({
|
||
"overflow": "hidden"
|
||
});
|
||
} else {
|
||
$(".head_navlist").stop().slideUp();
|
||
$(this).removeClass("closeNavbtn");
|
||
$("body").css({
|
||
"overflow-y": "auto"
|
||
});
|
||
}
|
||
});
|
||
|
||
$(".head_navlist ul li>span").click(function () {
|
||
|
||
$(this).parent("li").siblings().find(".sub_zinav").stop().slideUp();
|
||
$(this).parent("li").siblings().find("span").removeClass("cur")
|
||
$(this).siblings(".sub_zinav ").find(".sub_zinav3").stop().slideUp();
|
||
$(this).siblings(".sub_zinav ").find("i").removeClass("active");
|
||
if (!$(this).hasClass("cur")) {
|
||
$(this).siblings(".sub_zinav").stop().slideDown();
|
||
$(this).addClass("cur");
|
||
} else {
|
||
$(this).siblings(".sub_zinav").stop().slideUp();
|
||
$(this).removeClass("cur");
|
||
}
|
||
})
|
||
|
||
var window_width = $(window).innerWidth();
|
||
if (window_width >= 992) {
|
||
var B ;
|
||
$(".head_navlist li").on("mouseleave",function(){
|
||
var that = $(this)
|
||
B = setTimeout(function () {
|
||
that.find(".sub_zinav").hide();
|
||
}, 800);
|
||
});
|
||
$(".sub_zinav2").on("mouseleave",function(){
|
||
$(this).find("i").removeClass("active");
|
||
var that = $(this)
|
||
B = setTimeout(function () {
|
||
that.find(".sub_zinav3").hide();
|
||
}, 800);
|
||
});
|
||
$(".sub_zinav2").on("mouseenter",function(){
|
||
$(this).find("i").addClass("active");
|
||
$(this).find(".sub_zinav3").stop().slideDown();
|
||
$(".ProductNav").stop().hide()
|
||
clearTimeout(B);
|
||
});
|
||
|
||
$(".head_navlist li a").on("mouseenter",function(){
|
||
$(this).siblings(".sub_zinav").stop().slideDown();
|
||
$(this).parent("li").siblings().find(".sub_zinav").hide()
|
||
clearTimeout(B);
|
||
if($(this).siblings(".ProductNav").length > 0){
|
||
$(this).siblings(".Lhide").hide();
|
||
}else{
|
||
$(this).parent("li").siblings().find(".ProductNav").hide()
|
||
}
|
||
});
|
||
$(".head_navlist li a").on("mouseleave",function(){
|
||
clearTimeout(B);
|
||
})
|
||
}else{
|
||
$(".sub_zinav2 .Link2").click(function(){
|
||
$(this).siblings("i").toggleClass("active");
|
||
$(this).siblings(".sub_zinav3").stop().slideToggle();
|
||
$(this).parent().siblings().find("i").removeClass("active").siblings(".sub_zinav3").stop().slideUp()
|
||
})
|
||
}
|
||
|
||
|
||
|
||
|
||
$(".footer_nav .iconfontdown").click(function () {
|
||
if ($(this).hasClass("active")) {
|
||
$(this).parent("dl").find("dd").stop().slideUp()
|
||
$(this).removeClass("active")
|
||
} else {
|
||
$(this).parent("dl").find("dd").stop().slideDown()
|
||
$(this).addClass("active")
|
||
$(this).parent("dl").siblings().find(".footerNav3").stop().slideUp()
|
||
$(this).parent("dl").siblings().find("dd").stop().slideUp()
|
||
$(this).parent("dl").siblings().find("i").removeClass("active")
|
||
}
|
||
})
|
||
if ($(window).innerWidth() <= 992) {
|
||
$(".footerNav2").click(function(){
|
||
if($(this).find("i").hasClass("active")){
|
||
$(this).find("i").removeClass("active")
|
||
$(this).find(".footerNav3").stop().slideUp()
|
||
|
||
}else{
|
||
$(this).find("i").addClass("active")
|
||
$(this).find(".footerNav3").stop().slideDown()
|
||
$(this).siblings().find("i").removeClass("active")
|
||
$(this).siblings().find(".footerNav3").stop().slideUp()
|
||
|
||
}
|
||
})
|
||
}
|
||
|
||
$(".submenu_box .submenu_curtitle").click(function(){
|
||
if(!$(this).hasClass("cur")){
|
||
$(this).addClass("cur")
|
||
$(".submenu_box_list").stop().slideDown();
|
||
}else{
|
||
$(this).removeClass("cur")
|
||
$(".submenu_box_list").stop().slideUp();
|
||
}
|
||
});
|
||
|
||
$(".innew_tab .item").click(function(){
|
||
var index=$(this).index();
|
||
$(this).addClass("active").siblings().removeClass("active")
|
||
$(".innew_list .innew_item").eq(index).css("display","flex").siblings().css("display","none")
|
||
});
|
||
|
||
|
||
|
||
|
||
setHeader()
|
||
ifwidth();
|
||
|
||
});
|
||
|
||
|
||
|
||
|
||
function setHeader() {
|
||
var initHeight = $(document).scrollTop();
|
||
if (initHeight > 0) {
|
||
$(".header").addClass("header_active");
|
||
}
|
||
|
||
$(window).scroll(function () {
|
||
var b = $(document).scrollTop();
|
||
if (b <= 60) {
|
||
$('.header').removeClass("header_active");
|
||
|
||
} else {
|
||
$('.header').addClass("header_active");
|
||
}
|
||
})
|
||
}
|
||
|
||
function ifwidth() {
|
||
var window_width = $(window).innerWidth();
|
||
if (window_width >= 768) {
|
||
$(".index_townlist").addClass("swiper-no-swiping")
|
||
$(".purpose_swiper").addClass("swiper-no-swiping")
|
||
$(".incase_swiper").addClass("swiper-no-swiping")
|
||
}
|
||
}
|
||
|
||
$(function () {
|
||
$(".publicLeft .li h5").click(function () {
|
||
if($(this).parent(".li").hasClass("active2")){
|
||
$(this).parent(".li").removeClass("active2")
|
||
$(this).removeClass("active")
|
||
$(this).siblings(".li2,.Downul2").stop().slideUp().children("h5").removeClass("active")
|
||
}else if($(this).parent(".li").hasClass("active")){
|
||
$(this).parent(".li").removeClass("active")
|
||
$(this).removeClass("active")
|
||
$(this).siblings(".li2,.Downul2").stop().slideUp().children("h5").removeClass("active")
|
||
}else{
|
||
$(this).parent(".li").addClass("active")
|
||
$(this).addClass("active")
|
||
$(this).siblings(".li2,.Downul2").stop().slideDown()
|
||
}
|
||
|
||
|
||
|
||
})
|
||
$(".publicLeft .li .ul2 .li3 .t").click(function () {
|
||
$(this).toggleClass("active")
|
||
$(this).parents(".ul2").siblings().find(".t").removeClass("active")
|
||
$(this).parents(".ul2").siblings().find(".ul3").stop().slideUp()
|
||
$(this).siblings(".ul3").stop().slideToggle()
|
||
|
||
|
||
|
||
|
||
|
||
})
|
||
|
||
// $(".ProTabCont .tabItem").eq(0).show();
|
||
$(".ProTabBar .tabTerm").click(function(){
|
||
$(this).addClass('active');
|
||
$(this).siblings().removeClass("active");
|
||
var num =$(".ProTabBar .tabTerm").index(this);
|
||
$(".ProTabCont .tabItem").eq(num).addClass("active").siblings().removeClass("active");
|
||
|
||
var hei = $(".ProTabCont .tabItem").eq(num).height() + 70
|
||
$(".ProductNav").height(hei)
|
||
|
||
})
|
||
var window_width = $(window).innerWidth();
|
||
if (window_width > 992) {
|
||
var B ;
|
||
$(".header .ProductNavOff a").on("mouseenter",function(){
|
||
$(".ProductNav").stop().slideDown()
|
||
$("body").addClass("active")
|
||
clearTimeout(B);
|
||
});
|
||
$(".ProductNav").on("mouseenter",function(){
|
||
clearTimeout(B);
|
||
})
|
||
$(".header .ProductNavOff a").on("mouseleave",function(){
|
||
clearTimeout(B);
|
||
})
|
||
|
||
$(".header .ProductNavOff").on("mouseleave",function(){
|
||
B = setTimeout(function () {
|
||
$(".ProductNav").hide()
|
||
}, 800);
|
||
$("body").removeClass("active")
|
||
});
|
||
|
||
$(".header .ProductNav i").on("mouseenter",function(){
|
||
B = setTimeout(function () {
|
||
$(".ProductNav").stop().hide()
|
||
}, 800);
|
||
$("body").removeClass("active")
|
||
});
|
||
}
|
||
if (window_width < 768) {
|
||
// $(".publicLeft .li").removeClass("active")
|
||
}
|
||
|
||
/*视频播放*/
|
||
var myVideo=document.getElementById("Video1");
|
||
$('.TopicPageCon2 .off').on('click',function(){
|
||
if (myVideo.paused) {
|
||
setTimeout(() => {
|
||
myVideo.play();
|
||
}, 10 );
|
||
$(this).children("img").hide();
|
||
}else {
|
||
setTimeout(() => {
|
||
myVideo.pause();
|
||
}, 10 );
|
||
$(this).children("img").show();
|
||
}
|
||
})
|
||
/*视频播放*/
|
||
var myVideo2=document.getElementById("Video2");
|
||
$('.big_video .off').on('click',function(){
|
||
if (myVideo2.paused) {
|
||
setTimeout(() => {
|
||
myVideo2.play();
|
||
|
||
}, 10 );
|
||
$(this).children("img").hide();
|
||
$(this).siblings(".text").hide();
|
||
}else {
|
||
setTimeout(() => {
|
||
myVideo2.pause();
|
||
}, 10 );
|
||
$(this).children("img").show();
|
||
$(this).siblings(".text").show();
|
||
}
|
||
})
|
||
|
||
if (typeof BeerSlider != 'undefined') {
|
||
$('.slider').each(function(){
|
||
new BeerSlider(this);
|
||
});
|
||
}
|
||
|
||
new Swiper('.SolutionXQ_swiper', {
|
||
speed: 600,
|
||
slidesPerView: 3,
|
||
spaceBetween: 20,
|
||
scrollbar:'.SolutionXQ_scrollbar',
|
||
|
||
breakpoints:{
|
||
992: {
|
||
spaceBetween: 10,
|
||
},
|
||
765: {
|
||
spaceBetween: 10,
|
||
slidesPerView: 2,
|
||
},
|
||
465: {
|
||
spaceBetween: 10,
|
||
slidesPerView: 1,
|
||
}
|
||
}
|
||
});
|
||
|
||
$('.AnchorLocation .li').click(function() {
|
||
$(this).addClass("active").siblings().removeClass("active")
|
||
var num = $(this).index();
|
||
$('html,body').animate({ scrollTop: $('.Solution_XQ .box').eq(num).offset().top - 50 }, 500)
|
||
});
|
||
var CXQswiper1 = new Swiper('.classicCase_XQswiper1', {
|
||
speed: 600,
|
||
slidesPerView: 1,
|
||
onSlideChangeEnd: function(swiper){
|
||
var num = CXQswiper1.activeIndex;
|
||
$(".classicCase_XQswiper2 .swiper-slide").eq(num).addClass("active").siblings().removeClass("active")
|
||
}
|
||
|
||
});
|
||
var CXQswiper2 = new Swiper('.classicCase_XQswiper2', {
|
||
speed: 600,
|
||
slidesPerView: 6,
|
||
spaceBetween: 12,
|
||
breakpoints:{
|
||
992: {
|
||
slidesPerView: 5,
|
||
spaceBetween: 8,
|
||
},
|
||
765: {
|
||
spaceBetween:5,
|
||
slidesPerView: 4,
|
||
},
|
||
465: {
|
||
spaceBetween:5,
|
||
slidesPerView: 3,
|
||
}
|
||
}
|
||
|
||
});
|
||
$(".classicCase_XQswiper2 .swiper-slide").on("click",function(){
|
||
var num = $(this).index()
|
||
CXQswiper1.slideTo(num, 1000, false);//切换到第一个slide，速度为1秒
|
||
$(this).addClass("active").siblings().removeClass("active")
|
||
|
||
})
|
||
|
||
//tab切换
|
||
$(".ServiceTabCont .tabItem").eq(0).show();
|
||
$(".ServiceTabBar .tabTerm").click(function(){
|
||
$(this).addClass('active');
|
||
$(this).siblings().removeClass("active");
|
||
var num =$(".ServiceTabBar .tabTerm").index(this);
|
||
$(".ServiceTabCont .tabItem").eq(num).addClass("active").siblings().removeClass("active")
|
||
|
||
})
|
||
|
||
new Swiper('.News_swiper', {
|
||
effect : 'fade',
|
||
speed: 600,
|
||
autoplay : 4000,
|
||
pagination: '.News_pagination',
|
||
paginationClickable :true,
|
||
breakpoints:{
|
||
765: {
|
||
autoHeight: true,
|
||
},
|
||
}
|
||
|
||
});
|
||
|
||
var aboutUsCon6_swiper = new Swiper('.aboutUsCon6_swiper', {
|
||
slidesPerView:5,
|
||
// autoplay : 4000,
|
||
speed:500,
|
||
// loop:true,
|
||
prevButton:'.aboutCon6_prev',
|
||
nextButton:'.aboutCon6_next',
|
||
breakpoints:{
|
||
992: {
|
||
slidesPerView: 4,
|
||
},
|
||
765: {
|
||
slidesPerView: 3,
|
||
},
|
||
465: {
|
||
slidesPerView: 2,
|
||
}
|
||
},
|
||
onSlideChangeStart: function(swiper){
|
||
$(".aboutUsCon6_swiper .swiper-slide").eq(swiper.activeIndex).addClass("active").siblings().removeClass("active")
|
||
$(".aboutUs .con6 .box .li").eq(swiper.realIndex).addClass("active").siblings().removeClass("active")
|
||
}
|
||
});
|
||
|
||
$(".aboutUs .con6 .aboutUsCon6_swiper .swiper-slide").on('click',function(){
|
||
var num =$(this).index();
|
||
$(this).addClass("active").siblings().removeClass("active")
|
||
$(".aboutUs .con6 .box .li").eq(num).addClass("active").siblings().removeClass("active")
|
||
console.log(num)
|
||
})
|
||
|
||
new Swiper('.aboutUsCon7_swiper', {
|
||
slidesPerView:4,
|
||
spaceBetween: 20,
|
||
autoplay : 4000,
|
||
scrollbar:'.aboutUsCon7_scrollbar',
|
||
breakpoints:{
|
||
992: {
|
||
slidesPerView: 3,
|
||
},
|
||
765: {
|
||
slidesPerView: 2,
|
||
},
|
||
}
|
||
});
|
||
|
||
//tab切换
|
||
$(".Case_bigTabBar .tabTerm").click(function(){
|
||
$(this).addClass('active');
|
||
$(this).siblings().removeClass("active");
|
||
var num =$(".Case_bigTabBar .tabTerm").index(this);
|
||
$(".Case_bigTabCont .tabItem").eq(num).addClass("active").siblings().removeClass("active")
|
||
|
||
})
|
||
$(".Z6TopicPage6TabBar .tabTerm").click(function(){
|
||
$(this).addClass('active');
|
||
$(this).siblings().removeClass("active");
|
||
var num =$(".Z6TopicPage6TabBar .tabTerm").index(this);
|
||
$(".Z6TopicPage6TabCont .tabItem").eq(num).addClass("active").siblings().removeClass("active")
|
||
|
||
})
|
||
$(".Case_CCETabBar .tabTerm").click(function(){
|
||
$(this).addClass('active');
|
||
$(this).siblings().removeClass("active");
|
||
var num =$(".Case_CCETabBar .tabTerm").index(this);
|
||
$(".Case_CCETabCont .tabItem").eq(num).addClass("active").siblings().removeClass("active")
|
||
|
||
})
|
||
|
||
new Swiper('.PastHighlights_swiper', {
|
||
slidesPerView:3,
|
||
spaceBetween: 30,
|
||
prevButton:'.PastHighlights_prev',
|
||
nextButton:'.PastHighlights_next',
|
||
breakpoints:{
|
||
992: {
|
||
spaceBetween: 10,
|
||
},
|
||
765: {
|
||
slidesPerView: 2,
|
||
},
|
||
465: {
|
||
slidesPerView: 1,
|
||
},
|
||
}
|
||
});
|
||
|
||
// $(".TopicPageCon8").on('click',function(){
|
||
// console.log("点击了")
|
||
// $(".tipsbox").hide();
|
||
// });
|
||
|
||
$(".home4TabBar .tabTerm").click(function(){
|
||
$(this).addClass('active');
|
||
$(this).siblings().removeClass("active");
|
||
var num =$(".home4TabBar .tabTerm").index(this);
|
||
$(".home4TabCont .tabItem").eq(num).addClass("active").siblings().removeClass("active")
|
||
|
||
})
|
||
|
||
$(".publicLeft i").on("click",function(){
|
||
if($(this).hasClass("active")){
|
||
$(this).removeClass("active")
|
||
$(this).siblings(".li:not(:nth-child(2))").slideUp()
|
||
// $(this).siblings(".li.active").slideDown()
|
||
|
||
}else{
|
||
$(this).addClass("active")
|
||
$(this).siblings(".li").slideDown()
|
||
}
|
||
})
|
||
|
||
|
||
|
||
|
||
|
||
})
|
||
$(function(){
|
||
|
||
$(".TopicPageCon8").click(function(){
|
||
console.log('1')
|
||
$(".tipsbox").hide();
|
||
});
|
||
if($(".waves").length>0){
|
||
class ShaderProgram {
|
||
|
||
constructor( holder, options = {} ) {
|
||
|
||
options = Object.assign( {
|
||
antialias: false,
|
||
depthTest: false,
|
||
mousemove: false,
|
||
autosize: true,
|
||
side: 'front',
|
||
vertex: `
|
||
precision highp float;
|
||
|
||
attribute vec4 a_position;
|
||
attribute vec4 a_color;
|
||
|
||
uniform float u_time;
|
||
uniform vec2 u_resolution;
|
||
uniform vec2 u_mousemove;
|
||
uniform mat4 u_projection;
|
||
|
||
varying vec4 v_color;
|
||
|
||
void main() {
|
||
|
||
gl_Position = u_projection * a_position;
|
||
gl_PointSize = (10.0 / gl_Position.w) * 100.0;
|
||
|
||
v_color = a_color;
|
||
|
||
}`,
|
||
fragment: `
|
||
precision highp float;
|
||
|
||
uniform sampler2D u_texture;
|
||
uniform int u_hasTexture;
|
||
|
||
varying vec4 v_color;
|
||
|
||
void main() {
|
||
|
||
if ( u_hasTexture == 1 ) {
|
||
|
||
gl_FragColor = v_color * texture2D(u_texture, gl_PointCoord);
|
||
|
||
} else {
|
||
|
||
gl_FragColor = v_color;
|
||
|
||
}
|
||
|
||
}`,
|
||
uniforms: {},
|
||
buffers: {},
|
||
camera: {},
|
||
texture: null,
|
||
onUpdate: ( () => {} ),
|
||
onResize: ( () => {} ),
|
||
}, options )
|
||
|
||
var uniforms = Object.assign( {
|
||
time: { type: 'float', value: 0 },
|
||
hasTexture: { type: 'int', value: 0 },
|
||
resolution: { type: 'vec2', value: [ 0, 0 ] },
|
||
mousemove: { type: 'vec2', value: [ 0, 0 ] },
|
||
projection: { type: 'mat4', value: [ 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1 ] },
|
||
}, options.uniforms )
|
||
|
||
var buffers = Object.assign( {
|
||
position: { size: 3, data: [] },
|
||
color: { size: 4, data: [] },
|
||
}, options.buffers )
|
||
|
||
var camera = Object.assign( {
|
||
fov: 60,
|
||
near: 1,
|
||
far: 10000,
|
||
aspect: 1,
|
||
z: 100,
|
||
perspective: true,
|
||
}, options.camera )
|
||
|
||
var canvas = document.createElement( 'canvas' )
|
||
var gl = canvas.getContext( 'webgl', { antialias: options.antialias } )
|
||
|
||
if ( ! gl ) return false
|
||
|
||
this.count = 0
|
||
this.gl = gl
|
||
this.canvas = canvas
|
||
this.camera = camera
|
||
this.holder = holder
|
||
this.onUpdate = options.onUpdate
|
||
this.onResize = options.onResize
|
||
this.data = {}
|
||
|
||
holder.appendChild( canvas )
|
||
|
||
this.createProgram( options.vertex, options.fragment )
|
||
|
||
this.createBuffers( buffers )
|
||
this.createUniforms( uniforms )
|
||
|
||
this.updateBuffers()
|
||
this.updateUniforms()
|
||
|
||
this.createTexture( options.texture )
|
||
|
||
gl.enable( gl.BLEND )
|
||
gl.enable( gl.CULL_FACE )
|
||
gl.blendFunc( gl.SRC_ALPHA, gl.ONE )
|
||
gl[ options.depthTest ? 'enable' : 'disable' ]( gl.DEPTH_TEST )
|
||
|
||
if ( options.autosize )
|
||
window.addEventListener( 'resize', e => this.resize( e ), false )
|
||
if ( options.mousemove )
|
||
window.addEventListener( 'mousemove', e => this.mousemove( e ), false )
|
||
|
||
this.resize()
|
||
|
||
this.update = this.update.bind( this )
|
||
this.time = { start: performance.now(), old: performance.now() }
|
||
this.update()
|
||
|
||
}
|
||
|
||
mousemove( e ) {
|
||
|
||
var x = e.pageX / this.width * 2 - 1
|
||
var y = e.pageY / this.height * 2 - 1
|
||
|
||
this.uniforms.mousemove = [ x, y ]
|
||
|
||
}
|
||
|
||
resize( e ) {
|
||
|
||
var holder = this.holder
|
||
var canvas = this.canvas
|
||
var gl = this.gl
|
||
|
||
var width = this.width = holder.offsetWidth
|
||
var height = this.height = holder.offsetHeight
|
||
var aspect = this.aspect = width / height
|
||
var dpi = this.dpi = devicePixelRatio
|
||
|
||
canvas.width = width * dpi
|
||
canvas.height = height * dpi
|
||
canvas.style.width = width + 'px'
|
||
canvas.style.height = height + 'px'
|
||
|
||
gl.viewport( 0, 0, width * dpi, height * dpi )
|
||
gl.clearColor( 0, 0, 0, 0 )
|
||
|
||
this.uniforms.resolution = [ width, height ]
|
||
this.uniforms.projection = this.setProjection( aspect )
|
||
|
||
this.onResize( width, height, dpi )
|
||
|
||
}
|
||
|
||
setProjection( aspect ) {
|
||
|
||
var camera = this.camera
|
||
|
||
if ( camera.perspective ) {
|
||
|
||
camera.aspect = aspect
|
||
|
||
var fovRad = camera.fov * ( Math.PI / 180 )
|
||
var f = Math.tan( Math.PI * 0.5 - 0.5 * fovRad )
|
||
var rangeInv = 1.0 / ( camera.near - camera.far )
|
||
|
||
var matrix = [
|
||
f / camera.aspect, 0, 0, 0,
|
||
0, f, 0, 0,
|
||
0, 0, (camera.near + camera.far) * rangeInv, -1,
|
||
0, 0, camera.near * camera.far * rangeInv * 2, 0
|
||
]
|
||
|
||
matrix[ 14 ] += camera.z
|
||
matrix[ 15 ] += camera.z
|
||
|
||
return matrix
|
||
|
||
} else {
|
||
|
||
return [
|
||
2 / this.width, 0, 0, 0,
|
||
0, -2 / this.height, 0, 0,
|
||
0, 0, 1, 0,
|
||
-1, 1, 0, 1,
|
||
]
|
||
|
||
}
|
||
|
||
}
|
||
|
||
createShader( type, source ) {
|
||
|
||
var gl = this.gl
|
||
var shader = gl.createShader( type )
|
||
|
||
gl.shaderSource( shader, source )
|
||
gl.compileShader( shader )
|
||
|
||
if ( gl.getShaderParameter (shader, gl.COMPILE_STATUS ) ) {
|
||
|
||
return shader
|
||
|
||
} else {
|
||
|
||
console.log( gl.getShaderInfoLog( shader ) )
|
||
gl.deleteShader( shader )
|
||
|
||
}
|
||
|
||
}
|
||
|
||
createProgram( vertex, fragment ) {
|
||
|
||
var gl = this.gl
|
||
|
||
var vertexShader = this.createShader( gl.VERTEX_SHADER, vertex )
|
||
var fragmentShader = this.createShader( gl.FRAGMENT_SHADER, fragment )
|
||
|
||
var program = gl.createProgram()
|
||
|
||
gl.attachShader( program, vertexShader )
|
||
gl.attachShader( program, fragmentShader )
|
||
gl.linkProgram( program )
|
||
|
||
if ( gl.getProgramParameter( program, gl.LINK_STATUS ) ) {
|
||
|
||
gl.useProgram( program )
|
||
this.program = program
|
||
|
||
} else {
|
||
|
||
console.log( gl.getProgramInfoLog( program ) )
|
||
gl.deleteProgram( program )
|
||
|
||
}
|
||
|
||
}
|
||
|
||
createUniforms( data ) {
|
||
|
||
var gl = this.gl
|
||
var uniforms = this.data.uniforms = data
|
||
var values = this.uniforms = {}
|
||
|
||
Object.keys( uniforms ).forEach( name => {
|
||
|
||
var uniform = uniforms[ name ]
|
||
|
||
uniform.location = gl.getUniformLocation( this.program, 'u_' + name )
|
||
|
||
Object.defineProperty( values, name, {
|
||
set: value => {
|
||
|
||
uniforms[ name ].value = value
|
||
this.setUniform( name, value )
|
||
|
||
},
|
||
get: () => uniforms[ name ].value
|
||
} )
|
||
|
||
} )
|
||
|
||
}
|
||
|
||
setUniform( name, value ) {
|
||
|
||
var gl = this.gl
|
||
var uniform = this.data.uniforms[ name ]
|
||
|
||
uniform.value = value
|
||
|
||
switch ( uniform.type ) {
|
||
case 'int': {
|
||
gl.uniform1i( uniform.location, value )
|
||
break
|
||
}
|
||
case 'float': {
|
||
gl.uniform1f( uniform.location, value )
|
||
break
|
||
}
|
||
case 'vec2': {
|
||
gl.uniform2f( uniform.location, ...value )
|
||
break
|
||
}
|
||
case 'vec3': {
|
||
gl.uniform3f( uniform.location, ...value )
|
||
break
|
||
}
|
||
case 'vec4': {
|
||
gl.uniform4f( uniform.location, ...value )
|
||
break
|
||
}
|
||
case 'mat2': {
|
||
gl.uniformMatrix2fv( uniform.location, false, value )
|
||
break
|
||
}
|
||
case 'mat3': {
|
||
gl.uniformMatrix3fv( uniform.location, false, value )
|
||
break
|
||
}
|
||
case 'mat4': {
|
||
gl.uniformMatrix4fv( uniform.location, false, value )
|
||
break
|
||
}
|
||
}
|
||
|
||
// ivec2 : uniform2i,
|
||
// ivec3 : uniform3i,
|
||
// ivec4 : uniform4i,
|
||
// sampler2D : uniform1i,
|
||
// samplerCube : uniform1i,
|
||
// bool : uniform1i,
|
||
// bvec2 : uniform2i,
|
||
// bvec3 : uniform3i,
|
||
// bvec4 : uniform4i,
|
||
|
||
}
|
||
|
||
updateUniforms() {
|
||
|
||
var gl = this.gl
|
||
var uniforms = this.data.uniforms
|
||
|
||
Object.keys( uniforms ).forEach( name => {
|
||
|
||
var uniform = uniforms[ name ]
|
||
|
||
this.uniforms[ name ] = uniform.value
|
||
|
||
} )
|
||
|
||
}
|
||
|
||
createBuffers( data ) {
|
||
|
||
var gl = this.gl
|
||
var buffers = this.data.buffers = data
|
||
var values = this.buffers = {}
|
||
|
||
Object.keys( buffers ).forEach( name => {
|
||
|
||
var buffer = buffers[ name ]
|
||
|
||
buffer.buffer = this.createBuffer( 'a_' + name, buffer.size )
|
||
|
||
Object.defineProperty( values, name, {
|
||
set: data => {
|
||
|
||
buffers[ name ].data = data
|
||
this.setBuffer( name, data )
|
||
|
||
if ( name == 'position' )
|
||
this.count = buffers.position.data.length / 3
|
||
|
||
},
|
||
get: () => buffers[ name ].data
|
||
} )
|
||
|
||
} )
|
||
|
||
}
|
||
|
||
createBuffer( name, size ) {
|
||
|
||
var gl = this.gl
|
||
var program = this.program
|
||
|
||
var index = gl.getAttribLocation( program, name )
|
||
var buffer = gl.createBuffer()
|
||
|
||
gl.bindBuffer( gl.ARRAY_BUFFER, buffer )
|
||
gl.enableVertexAttribArray( index )
|
||
gl.vertexAttribPointer( index, size, gl.FLOAT, false, 0, 0 )
|
||
|
||
return buffer
|
||
|
||
}
|
||
|
||
setBuffer( name, data ) {
|
||
|
||
var gl = this.gl
|
||
var buffers = this.data.buffers
|
||
|
||
if ( name == null && ! gl.bindBuffer( gl.ARRAY_BUFFER, null ) ) return
|
||
|
||
gl.bindBuffer( gl.ARRAY_BUFFER, buffers[ name ].buffer )
|
||
gl.bufferData( gl.ARRAY_BUFFER, new Float32Array( data ), gl.STATIC_DRAW )
|
||
|
||
}
|
||
|
||
updateBuffers() {
|
||
|
||
var gl = this.gl
|
||
var buffers = this.buffers
|
||
|
||
Object.keys( buffers ).forEach( name =>
|
||
buffers[ name ] = buffer.data
|
||
)
|
||
|
||
this.setBuffer( null )
|
||
|
||
}
|
||
|
||
createTexture( src ) {
|
||
|
||
var gl = this.gl
|
||
var texture = gl.createTexture()
|
||
|
||
gl.bindTexture( gl.TEXTURE_2D, texture )
|
||
gl.texImage2D( gl.TEXTURE_2D, 0, gl.RGBA, 1, 1, 0, gl.RGBA, gl.UNSIGNED_BYTE, new Uint8Array( [ 0, 0, 0, 0 ] ) )
|
||
|
||
this.texture = texture
|
||
|
||
if ( src ) {
|
||
|
||
this.uniforms.hasTexture = 1
|
||
this.loadTexture( src )
|
||
|
||
}
|
||
|
||
}
|
||
|
||
loadTexture( src ) {
|
||
|
||
var gl = this.gl
|
||
var texture = this.texture
|
||
|
||
var textureImage = new Image()
|
||
|
||
textureImage.onload = () => {
|
||
|
||
gl.bindTexture( gl.TEXTURE_2D, texture )
|
||
|
||
gl.texImage2D( gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, textureImage )
|
||
|
||
gl.texParameteri( gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR )
|
||
gl.texParameteri( gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR )
|
||
|
||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE)
|
||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE)
|
||
|
||
// gl.generateMipmap( gl.TEXTURE_2D )
|
||
|
||
}
|
||
|
||
textureImage.src = src
|
||
|
||
}
|
||
|
||
update() {
|
||
|
||
var gl = this.gl
|
||
|
||
var now = performance.now()
|
||
var elapsed = ( now - this.time.start ) / 5000
|
||
var delta = now - this.time.old
|
||
this.time.old = now
|
||
|
||
this.uniforms.time = elapsed
|
||
|
||
if ( this.count > 0 ) {
|
||
gl.clear( gl.COLORBUFFERBIT )
|
||
gl.drawArrays( gl.POINTS, 0, this.count )
|
||
}
|
||
|
||
this.onUpdate( delta )
|
||
|
||
requestAnimationFrame( this.update )
|
||
|
||
}
|
||
|
||
}
|
||
|
||
var pointSize = 2.5
|
||
|
||
var waves = new ShaderProgram( document.querySelector( '.waves' ), {
|
||
texture: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAb1BMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////8v0wLRAAAAJHRSTlMAC/goGvDhmwcExrVjWzrm29TRqqSKenRXVklANSIUE8mRkGpv+HOfAAABCElEQVQ4y4VT13LDMAwLrUHteO+R9f/fWMfO6dLaPeKVEECRxOULWsEGpS9nULDwia2Y+ALqUNbAWeg775zv+sA4/FFRMxt8U2FZFCVWjR/YrH4/H9sarclSKdPMWKzb8VsEeHB3m0shkhVCyNzeXeAQ9Xl4opEieX2QCGnwGbj6GMyjw9t1K0fK9YZunPXeAGsfJtYjwzxaBnozGGorYz0ypK2HzQSYx1y8DgSRo2ewOiyh2QWOEk1Y9OrQV0a8TiBM1a8eMHWYnRMy7CZ4t1CmyRkhSUvP3gRXyHOCLBxNoC3IJv//ZrJ/kxxUHPUB+6jJZZHrpg6GOjnqaOmzp4NDR48OLxn/H27SRQ08S0ZJAAAAAElFTkSuQmCC',
|
||
uniforms: {
|
||
size: { type: 'float', value: pointSize },
|
||
field: { type: 'vec3', value: [ 0, 0, 0 ] },
|
||
speed: { type: 'float', value: 5 },
|
||
},
|
||
vertex: `
|
||
#define M_PI 3.1415926535897932384626433832795
|
||
|
||
precision highp float;
|
||
|
||
attribute vec4 a_position;
|
||
attribute vec4 a_color;
|
||
|
||
uniform float u_time;
|
||
uniform float u_size;
|
||
uniform float u_speed;
|
||
uniform vec3 u_field;
|
||
uniform mat4 u_projection;
|
||
|
||
varying vec4 v_color;
|
||
|
||
void main() {
|
||
|
||
vec3 pos = a_position.xyz;
|
||
|
||
pos.y += (
|
||
cos(pos.x / u_field.x * M_PI * 8.0 + u_time * u_speed) +
|
||
sin(pos.z / u_field.z * M_PI * 8.0 + u_time * u_speed)
|
||
) * u_field.y;
|
||
|
||
gl_Position = u_projection * vec4( pos.xyz, a_position.w );
|
||
gl_PointSize = ( u_size / gl_Position.w ) * 100.0;
|
||
|
||
v_color = a_color;
|
||
|
||
}`,
|
||
fragment: `
|
||
precision highp float;
|
||
|
||
uniform sampler2D u_texture;
|
||
|
||
varying vec4 v_color;
|
||
|
||
void main() {
|
||
|
||
gl_FragColor = v_color * texture2D(u_texture, gl_PointCoord);
|
||
|
||
}`,
|
||
onResize( w, h, dpi ) {
|
||
|
||
var position = [], color = []
|
||
|
||
var width = 400 * ( w / h )
|
||
var depth = 400
|
||
var height = 3
|
||
var distance = 5
|
||
|
||
for ( var x = 0; x < width; x += distance ) {
|
||
for ( var z = 0; z < depth; z+= distance ) {
|
||
|
||
position.push( - width / 2 + x, -30, -depth / 2 + z )
|
||
color.push( 0, 1 - ( x / width ) * 1, 0.5 + x / width * 0.5, z / depth )
|
||
|
||
}
|
||
}
|
||
|
||
this.uniforms.field = [ width, height, depth ]
|
||
|
||
this.buffers.position = position
|
||
this.buffers.color = color
|
||
|
||
this.uniforms.size = ( h / 400) * pointSize * dpi
|
||
|
||
},
|
||
} )
|
||
}
|
||
|
||
});
|
||
|
||
// $body = (window.opera) ? (document.compatMode == "CSS1Compat" ? $("html") : $("body")) : $("html,body");
|
||
// $("#ScrollTop").click(function () {
|
||
// $body.animate({ scrollTop: 0 }, 400)
|
||
// });
|
||
|
||
|
||
// 使用jQuery绑定点击事件到ID为"ScrollTop"的元素
|
||
$("#ScrollTop").click(function() {
|
||
// 使用jQuery的animate函数来平滑滚动到页面顶部
|
||
$("html, body").animate({
|
||
scrollTop: 0
|
||
}, 400);
|
||
});
|
||
|
||
// $(function() {
|
||
// const currentTime = new Date().getTime();
|
||
// const lastPopupTime = localStorage.getItem("lastPopupTime");
|
||
// const showPopupDuration = 15 * 60 * 1000; // 设置为15分钟，用户关闭后15分钟内不再弹出
|
||
// // const showPopupDuration = 1 * 1000; // 设置为15分钟，用户关闭后15分钟内不再弹出
|
||
// $(window).on('load', function() {
|
||
|
||
// // 检查是否应该显示弹框
|
||
// if (shouldShowPopup(lastPopupTime, currentTime)) {
|
||
// // 显示图片弹框
|
||
// $("#popupMessage").css("display", "flex");
|
||
// }
|
||
|
||
// // 点击关闭按钮
|
||
// $("#closePopup").click(function() {
|
||
// $("#popupMessage").css("display", "none");
|
||
// // 记录关闭时间
|
||
// localStorage.setItem("lastPopupTime", currentTime);
|
||
// });
|
||
|
||
// // 点击“不再提醒”按钮
|
||
// $("#dontShowAgain").click(function() {
|
||
// $("#popupMessage").css("display", "none");
|
||
// // 设置不再显示的标记
|
||
// localStorage.setItem("dontShowPopupAgain", "true");
|
||
// });
|
||
// });
|
||
|
||
// // 判断是否应该显示弹框
|
||
// function shouldShowPopup(lastPopupTime, currentTime) {
|
||
// // 如果用户已经选择“不再提醒”，则不显示
|
||
// if (localStorage.getItem("dontShowPopupAgain") === "true") {
|
||
// return false;
|
||
// }
|
||
|
||
// // 如果没有记录上次显示时间，或者超过了设置的时间（例如7天）
|
||
// if (!lastPopupTime || currentTime - lastPopupTime > showPopupDuration) {
|
||
// return true;
|
||
// }
|
||
|
||
// return false;
|
||
|
||
// };
|
||
// })
|
||
|
||
|
||
|
||
|