1/** 2 * @Description: ãæ æã 3 * @Author: MaXueWei 4 * @Date: 2024-1-25 09:24:53 5 * @LastEditors: MaXueWei 6 * @LastEditTime: 2024-1-25 09:24:53 7 */ 8$(function () { 9 // åå§å AOS 10 AOS && AOS.init({ duration: 1000 }); 11}); 12 13// ==================== swiperé»è®¤åé¡µå¨ Start ==================== 14function pageInit(swiper, pagination, option) { 15 this.swiper = swiper; 16 this.pagination = pagination; 17 this.option = option; 18} 19pageInit.prototype.init = function () { 20 const that = this 21 let timer = null 22 let time = 5 23 let temp_time = 0 24 let stop = false 25 let option = { 26 speed: 1000, 27 resistanceRatio: 0, // æµæçã 28 // autoplay: { 29 // delay: 5000, 30 // disableOnInteraction: false, 31 // }, 32 autoHeight: true, 33 preventClicks: false, //é»è®¤true 34 allowTouchMove: false, 35 observer: true, 36 observeParents: true, 37 watchSlidesProgress: true, 38 watchSlidesVisibility: true, 39 loop: true, 40 spaceBetween: 20, 41 // navigation: { 42 // nextEl: ".index-section3-swiper .swiper-button-next", 43 // prevEl: ".index-section3-swiper .swiper-button-prev", 44 // }, 45 on: { 46 paginationUpdate: function () { 47 }, 48 slideChange: function () { 49 }, 50 slideChangeTransitionEnd: function () { 51 $(that.pagination).find(".swiper-pagination .swiper-pagination-bullet:not(.swiper-pagination-bullet-active) i").css("width", "0"); 52 $(that.pagination + " .swiper-pagination .swiper-pagination-bullet:not(.swiper-pagination-bullet-active) i").css("width", "0"); 53 } 54 }, 55 pagination: { 56 el: that.pagination + " .swiper-pagination", 57 clickable: true, 58 // renderBullet: function (index, className) { 59 // return '<span class="' + className + '"><i></i></span>'; 60 // }, 61 }, 62 } 63 if (that.option) { 64 option = that.option 65 ? { ...option, ...that.option } 66 : option; 67 } 68 const swiper = new Swiper(that.swiper, option); 69 function start() { 70 // time = 5 71 timer = setInterval(() => { 72 --time 73 //console.log(time); 74 if (time === 0) { 75 // console.log("忢"); 76 swiper.slideNext(); 77 time = 5 78 } 79 }, 1000) 80 } 81 $(that.pagination + " .play-btn").on("click", function () { 82 stop = !stop 83 $(this).toggleClass("active") 84 $(that.pagination + " .swiper-pagination .swiper-pagination-bullet-active").toggleClass("paused") 85 if (stop) { 86 temp_time = time 87 clearInterval(timer) 88 // console.log("æå", time); 89 } else { 90 time = temp_time 91 // console.log("å¼å§", time); 92 start() 93 } 94 }) 95 $(that.pagination + " .swiper-pagination .swiper-pagination-bullet").on("click", function () { 96 time = 5 97 clearInterval(timer) 98 start() 99 $(that.pagination + " .play-btn").removeClass("active") 100 stop = false 101 }) 102 start(); 103 104 that.initPage(); 105 106 return swiper 107} 108pageInit.prototype.initPage = function () { 109 const that = this 110 let play = false 111 let status = false 112 const tl = gsap.timeline({ 113 scrollTrigger: { 114 trigger: $(that.swiper).parent(), 115 start: "top+=20% center", 116 end: "bottom center", 117 scrub: true, 118 // markers: true, 119 onEnter: function () { 120 status = true 121 // console.log("onEnter"); 122 !play && tl2.restart(); 123 124 }, 125 onLeaveBack: function () { 126 status = false 127 // console.log("onLeaveBack"); 128 !play && tl3.restart(); 129 }, 130 } 131 }) 132 const tl2 = gsap.timeline({ 133 onStart: () => { 134 play = true 135 // console.log("åºç°å¨ç»å¼å§æ§è¡", play.start); 136 }, 137 onComplete: () => { 138 play = false 139 if (!status) { tl3.restart() } 140 // console.log("åºç°å¨ç»æ§è¡ç»æ", play.start); 141 } 142 }) 143 const tl3 = gsap.timeline({ 144 onStart: () => { 145 play = true 146 // console.log("ç»æå¨ç»å¼å§æ§è¡", play.end); 147 }, 148 onComplete: () => { 149 play = false 150 if (status) { tl2.restart() } 151 // console.log("ç»æå¨ç»æ§è¡ç»æ", play.end); 152 } 153 }) 154 let bullet_width = $(that.pagination).find(".pagination").width(); 155 let btnWidth = $(that.pagination + " .play-btn").width() 156 tl2.set(that.pagination, { opacity: 1 }) 157 tl2.set(that.pagination + " .pagination", { width: btnWidth, xPercent: 58 }) 158 tl2.from(that.pagination + " .body", { scale: 0, yPercent: 300, duration: 0.35, ease: "back.out(2)" }) 159 tl2.from(that.pagination + " .play-btn-bg", { scale: 1.7, duration: 0.2, ease: "back.in" }) 160 tl2.to(that.pagination + " .play-btn-bg", { scale: 0, duration: 0.2, ease: "back.out" }) 161 // tl2.from(that.pagination + " .pagination", { width: btnWidth, xPercent: 58, duration: 0.4 }) 162 tl2.to(that.pagination + " .pagination", { width: bullet_width, xPercent: 0, duration: 0.4 }) 163 tl2.from(that.pagination + " .play-btn", { xPercent: -58, duration: 0.4 }, "<") 164 tl2.to(that.pagination + " .pagination .swiper-pagination-bullet", { opacity: 1, duration: 0.4 }) 165 tl2.from(that.pagination + " .play-btn .iconfont", { opacity: 0, duration: 0.4 }, "<") 166 tl2.reverse() 167 // // 卿¶é´è½´çæ«å°¾æ·»å ä¸ä¸ªæ ç¾ 168 // tl2.addLabel("endState"); 169 // // å°æ¶é´è½´çè¿åº¦ç´æ¥è·³è½¬å°æ ç¾å¤ 170 // tl2.seek("endState"); 171 172 tl3.to(that.pagination + " .play-btn .iconfont", { opacity: 0, duration: 0.3 }) 173 tl3.to(that.pagination + " .pagination .swiper-pagination-bullet", { opacity: 0, duration: 0.3 }, "<") 174 tl3.to(that.pagination + " .pagination", { width: btnWidth, xPercent: 58, duration: 0.3 }) 175 tl3.to(that.pagination + " .play-btn", { xPercent: -58, duration: 0.3 }, "<") 176 tl3.to(that.pagination + " .body", { scale: 0, duration: 0.25, ease: "back.in" }) 177 tl3.reverse() 178 179 // function refresh() { 180 // status = true 181 // play = true 182 // // width = $(that.pagination).find(".pagination").width(); 183 // // btnWidth = $(that.pagination + " .play-btn").width() 184 // console.log($(that.pagination).find('.swiper-pagination').css("padding")); 185 // console.log('aa',$(that.pagination).find('.swiper-pagination .swiper-pagination-bullet').width()); 186 // tl2.restart(); 187 // // console.log("å·æ°æé®width", width); 188 // // console.log("å·æ°æé®btnWidth", btnWidth); 189 // } 190 // // window.addEventListener("pageshow", function () { 191 // // refresh(); 192 // // }); 193 // window.addEventListener("resize", function () { 194 // refresh(); 195 // }); 196} 197// ==================== swiperé»è®¤åé¡µå¨ Start ==================== 198// ==================== éç¨æé®1 Start ==================== 199function commonBtn(el, startEl) { 200 this.el = el 201 this.startEl = startEl 202} 203commonBtn.prototype.init = function () { 204 const that = this 205 let play = false 206 let status = false 207 const tl = gsap.timeline({ 208 scrollTrigger: { 209 trigger: that.startEl || that.el, 210 start: "top+=20% center", 211 end: "bottom center", 212 scrub: true, 213 // markers: true, 214 onEnter: function () { 215 status = true 216 // console.log("onEnter"); 217 !play && tl2.restart(); 218 219 }, 220 onLeaveBack: function () { 221 status = false 222 // console.log("onLeaveBack"); 223 !play && tl3.restart(); 224 }, 225 } 226 }) 227 const tl2 = gsap.timeline({ 228 onStart: () => { 229 play = true 230 // console.log("åºç°å¨ç»å¼å§æ§è¡", play.start); 231 }, 232 onComplete: () => { 233 play = false 234 if (!status) { tl3.restart() } 235 // console.log("åºç°å¨ç»æ§è¡ç»æ", play.start); 236 } 237 }) 238 const tl3 = gsap.timeline({ 239 onStart: () => { 240 play = true 241 // console.log("ç»æå¨ç»å¼å§æ§è¡", play.end); 242 }, 243 onComplete: () => { 244 play = false 245 if (status) { tl2.restart() } 246 // console.log("ç»æå¨ç»æ§è¡ç»æ", play.end); 247 } 248 }) 249 let btnWidth = $(that.el + " .common-btn-box .btn-content").height() 250 tl2.set(that.el + " .common-btn-box", { display: "block", }) 251 tl2.from(that.el + " .common-btn-box", { scale: 0, opacity: 0, yPercent: 300, duration: 0.35 }) 252 tl2.from(that.el + " .common-btn-box .btn-content", { scale: 0, duration: 0, ease: "back.in" }, "<") 253 tl2.from(that.el + " .common-btn-box .play-btn-bg", { scale: 1.25, duration: 0.2, ease: "back.in" }) 254 tl2.to(that.el + " .common-btn-box .play-btn-bg", { scale: 0, duration: 0.2, ease: "back.out" }) 255 tl2.from(that.el + " .common-btn-box .icon", { scale: 0, duration: 0.4 }, "<") 256 tl2.from(that.el + " .common-btn-box .text", { width: 0, padding: 0, duration: 0.4, ease: "back.out" }) 257 tl2.from(that.el + " .common-btn-box .btn-content", { padding: 0, width: btnWidth, duration: 0.4, ease: "back.out" }, "<") 258 tl2.from(that.el + " .common-btn-box .text", { opacity: 0, duration: 0.4 }, "<0.1") 259 tl2.reverse() 260 261 tl3.to(that.el + " .common-btn-box .text", { opacity: 0, duration: 0.3 }) 262 tl3.to(that.el + " .common-btn-box .icon", { scale: 0, duration: 0.3 }, "<") 263 tl3.to(that.el + " .common-btn-box .btn-content", { padding: 0, width: btnWidth, duration: 0.3 }) 264 tl3.to(that.el + " .common-btn-box .btn-content", { scale: 0, duration: 0.3 }) 265 tl3.reverse() 266} 267// ==================== éç¨æé®1 End ==================== 268// ==================== éç¨å¼¹çª Start ==================== 269/** 270 * éç¨å¼¹çª 271 * @param {*} btnEl ä¼ å ¥æå¼å¼¹çªçæé®çid 272 * @param {*} popupEl ä¼ å ¥å¼¹çªç容å¨çid 273 */ 274function commonPopup(btnEl, popupEl) { 275 this.btnEl = btnEl 276 this.popupEl = popupEl 277} 278commonPopup.prototype.init = function () { 279 const that = this 280 $(that.btnEl).on("click", function () { 281 $(that.popupEl).show(); 282 setTimeout(() => { 283 $(that.popupEl).animate({ scrollTop: 0 }, 10) 284 $(that.popupEl).addClass("active") 285 $('html').addClass("no-scroll") 286 }, 10) 287 }) 288 $(that.popupEl).find(".close").on("click", function () { 289 $(that.popupEl).removeClass("active") 290 $(that.popupEl).find("video").length && $(that.popupEl).find("video")[0].pause(); 291 setTimeout(() => { 292 $(that.popupEl).hide(); 293 $('html').removeClass("no-scroll") 294 }, 500) 295 }) 296 // $(that.popupEl).on("click", function () { 297 // $(that.popupEl).removeClass("active") 298 // setTimeout(() => { 299 // $(that.popupEl).hide(); 300 // $('html').removeClass("no-scroll") 301 // }, 500) 302 // }) 303 // $(that.popupEl).find(".popup-box").on("click", function (e) { 304 // e.stopPropagation(); 305 // }) 306} 307// ==================== éç¨å¼¹çª End ==================== 308// ==================== 页颿´æ°ä¸æ¬è¯·æå¾ Start ==================== 309$(".alter-btn").on("click", function () { 310 alert("å 容æ£å¨æ´æ°ä¸ï¼æ¬è¯·æå¾ ï¼") 311}) 312// ==================== 页颿´æ°ä¸æ¬è¯·æå¾ End ==================== 313// ==================== éç¨è§é¢æ»å¨ Start ==================== 314/** 315 * 316 * @param {*} el å®ä½çå®¹å¨ 317 * @param {*} video æ§å¶çè§é¢ 318 * @param {*} duration æç»æ¶é´ 319 * @param {*} option åç¬é ç½®ï¼å¯éï¼ 320 */ 321function ScrollVideo(el, video, duration, option) { 322 this.el = el 323 this.video = document.querySelector(video) 324 this.duration = duration 325 this.option = option || undefined 326 327} 328ScrollVideo.prototype.init = function () { 329 const _this = this 330 331 if (_this.option) { 332 const tl = gsap.timeline({ 333 scrollTrigger: _this.option 334 }) 335 return tl 336 } else { 337 const duration = _this.duration ? _this.duration : 2000 338 const tl = gsap.timeline({ 339 scrollTrigger: { 340 trigger: _this.el, 341 start: 'top top', 342 end: '+=' + duration, 343 scrub: true, 344 // markers: true, 345 pin: true, 346 onLeave: function () { 347 AOS.refresh(); 348 ScrollTrigger.refresh(); 349 }, 350 onLeaveBack: function () { 351 }, 352 onUpdate: function (self) { 353 try { 354 _this.video.currentTime = self.progress * _this.video.duration; 355 } catch (e) { 356 console.log(_this.video.currentTime); 357 } 358 } 359 } 360 }) 361 const video = document.createElement('video'); 362 video.autoplay = true; 363 video.loop = true; 364 video.muted = true; 365 video.playsinline = true; 366 video.setAttribute('type', 'video/mp4'); 367 video.setAttribute('webkit-playsinline', true); 368 video.setAttribute('x-webkit-airplay', true);
369 video.setAttribute('x5-video-orientation', 'h5'); 370 video.setAttribute('x5-video-player-fullscreen', true); 371 video.setAttribute('x5-video-player-type', 'h5'); 372 video.classList.add('video-hide'); 373 374 const source = document.createElement('source'); 375 source.setAttribute('src', _this.video.getAttribute('src')); 376 377 video.appendChild(source); 378 document.body.appendChild(video); 379 380 381 return tl 382 } 383} 384// ==================== éç¨è§é¢æ»å¨ End ==================== 385// ==================== éè¿æºå夿èªå¨è·³è½¬ Start ==================== 386function autoJump(url) { 387 if (/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) { 388 // window.mobile = true; 389 window.location.href = url; 390 console.log("ç§»å¨ç«¯"); 391 } else { 392 console.log("çµè端"); 393 // window.location.href = url; 394 } 395} 396// ==================== éè¿æºå夿èªå¨è·³è½¬ End ====================
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.