This commit is contained in:
yiqiu
1597
css/index.css
1597
css/index.css
File diff suppressed because it is too large
Load Diff
259
js/index.js
259
js/index.js
@@ -1,4 +1,55 @@
|
||||
$(function () {
|
||||
// ============================================
|
||||
// 滚动动画效果 - Intersection Observer
|
||||
// ============================================
|
||||
function initScrollAnimations() {
|
||||
const observerOptions = {
|
||||
threshold: 0.1,
|
||||
rootMargin: '0px 0px -50px 0px'
|
||||
};
|
||||
|
||||
const observer = new IntersectionObserver((entries) => {
|
||||
entries.forEach(entry => {
|
||||
if (entry.isIntersecting) {
|
||||
entry.target.classList.add('animated');
|
||||
// 一次性动画，触发后不再观察
|
||||
observer.unobserve(entry.target);
|
||||
}
|
||||
});
|
||||
}, observerOptions);
|
||||
|
||||
// 为所有section添加滚动动画
|
||||
document.querySelectorAll('.section').forEach((section, index) => {
|
||||
section.classList.add('animate-on-scroll');
|
||||
observer.observe(section);
|
||||
});
|
||||
|
||||
// 为服务卡片添加延迟动画
|
||||
document.querySelectorAll('.service-box').forEach((box, index) => {
|
||||
box.classList.add('animate-on-scroll', `delay-${(index % 3) + 1}`);
|
||||
observer.observe(box);
|
||||
});
|
||||
|
||||
// 为解决方案卡片添加动画
|
||||
document.querySelectorAll('.resolve-box').forEach((box, index) => {
|
||||
box.classList.add('animate-on-scroll', `delay-${(index % 4) + 1}`);
|
||||
observer.observe(box);
|
||||
});
|
||||
|
||||
// 为新闻列表添加动画
|
||||
document.querySelectorAll('.news-cont').forEach(cont => {
|
||||
cont.classList.add('scale-on-scroll');
|
||||
observer.observe(cont);
|
||||
});
|
||||
}
|
||||
|
||||
// 页面加载完成后初始化动画
|
||||
setTimeout(initScrollAnimations, 100);
|
||||
|
||||
// ============================================
|
||||
// 原有功能代码
|
||||
// ============================================
|
||||
|
||||
// 获取url地址栏参数函数
|
||||
function getUrlParams() {
|
||||
const url = window.location.href;
|
||||
@@ -85,114 +136,114 @@ $(function () {
|
||||
}
|
||||
// 获取首页数据
|
||||
getCommentInfo();
|
||||
var viewer = new Viewer(document.getElementById("viewer"), {
|
||||
button: true,
|
||||
inline: false,
|
||||
zoomable: true,
|
||||
title: true,
|
||||
tooltip: true,
|
||||
minZoomRatio: 0.5,
|
||||
maxZoomRatio: 100,
|
||||
movable: true,
|
||||
interval: 2000,
|
||||
navbar: true,
|
||||
loading: true,
|
||||
});
|
||||
|
||||
var viewer = new Viewer(document.getElementById("viewer"), {
|
||||
button: true,
|
||||
inline: false,
|
||||
zoomable: true,
|
||||
title: true,
|
||||
tooltip: true,
|
||||
minZoomRatio: 0.5,
|
||||
maxZoomRatio: 100,
|
||||
movable: true,
|
||||
interval: 2000,
|
||||
navbar: true,
|
||||
loading: true,
|
||||
});
|
||||
|
||||
// 点击显示图片
|
||||
$(".cert-item,.practice-box,.brand-box").click(function () {
|
||||
// 设置图片
|
||||
$("#viewer").attr("src", $(this).find("img").attr("src"));
|
||||
viewer.show();
|
||||
});
|
||||
function formateTimeFun(time) {
|
||||
const date = new Date(time * 1000);
|
||||
Y = date.getFullYear() + "-";
|
||||
M =
|
||||
(date.getMonth() + 1 < 10
|
||||
? "0" + (date.getMonth() + 1)
|
||||
: date.getMonth() + 1) + "-";
|
||||
D = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
|
||||
return Y + M + D;
|
||||
}
|
||||
function formateTimeFun(time) {
|
||||
const date = new Date(time * 1000);
|
||||
Y = date.getFullYear() + "-";
|
||||
M =
|
||||
(date.getMonth() + 1 < 10
|
||||
? "0" + (date.getMonth() + 1)
|
||||
: date.getMonth() + 1) + "-";
|
||||
D = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
|
||||
return Y + M + D;
|
||||
}
|
||||
// 公告列表
|
||||
function getAnnounceList() {
|
||||
$.ajax({
|
||||
url: "/console/v1/announcement",
|
||||
method: "get",
|
||||
data: {
|
||||
page: 1,
|
||||
limit: 5,
|
||||
},
|
||||
success: function (res) {
|
||||
const announceList = res.data.list;
|
||||
announceList.forEach((item, index) => {
|
||||
$("#announceList").append(`
|
||||
<div class="news-item">
|
||||
<div class="fboxRow Ycenter">
|
||||
<div class="number">${index + 1}</div>
|
||||
<a href="./announce-details.html?id=${item.id}">
|
||||
<div class="title font-ell1">${item.title}</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="time">${formateTimeFun(item.create_time)}</div>
|
||||
</div>
|
||||
`);
|
||||
});
|
||||
},
|
||||
});
|
||||
}
|
||||
getAnnounceList();
|
||||
// 新闻列表
|
||||
function getNewsList() {
|
||||
$.ajax({
|
||||
url: "/console/v1/news",
|
||||
method: "get",
|
||||
data: {
|
||||
page: 1,
|
||||
limit: 5,
|
||||
},
|
||||
success: function (res) {
|
||||
const announceList = res.data.list;
|
||||
announceList.forEach((item, index) => {
|
||||
$("#newsList").append(`
|
||||
<div class="news-item">
|
||||
<div class="fboxRow Ycenter">
|
||||
<div class="number">${index + 1}</div>
|
||||
<a href="./news-details.html?id=${item.id}">
|
||||
<div class="title font-ell1">${item.title}</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="time">${formateTimeFun(item.create_time)}</div>
|
||||
</div>
|
||||
`);
|
||||
});
|
||||
},
|
||||
});
|
||||
}
|
||||
getNewsList();
|
||||
|
||||
$("#myTabs a").click(function (e) {
|
||||
e.preventDefault();
|
||||
$(this).tab("show");
|
||||
});
|
||||
// 跳转函数
|
||||
function goOtherPage(url) {
|
||||
location.href = url;
|
||||
}
|
||||
$("#cloud-box").click(function () {
|
||||
location.href = "cloud.html";
|
||||
});
|
||||
$("#domain-box").click(function () {
|
||||
location.href = "domain.html";
|
||||
});
|
||||
$("#recomment-box").click(function () {
|
||||
location.href = "/home.htm";
|
||||
});
|
||||
$("#logon-box").click(function () {
|
||||
location.href = "/regist.htm";
|
||||
});
|
||||
$("#cps-box").click(function () {
|
||||
location.href = "partner/cps.html";
|
||||
});
|
||||
});
|
||||
function getAnnounceList() {
|
||||
$.ajax({
|
||||
url: "/console/v1/announcement",
|
||||
method: "get",
|
||||
data: {
|
||||
page: 1,
|
||||
limit: 5,
|
||||
},
|
||||
success: function (res) {
|
||||
const announceList = res.data.list;
|
||||
announceList.forEach((item, index) => {
|
||||
$("#announceList").append(`
|
||||
<div class="news-item">
|
||||
<div class="fboxRow Ycenter">
|
||||
<div class="number">${index + 1}</div>
|
||||
<a href="./announce-details.html?id=${item.id}">
|
||||
<div class="title font-ell1">${item.title}</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="time">${formateTimeFun(item.create_time)}</div>
|
||||
</div>
|
||||
`);
|
||||
});
|
||||
},
|
||||
});
|
||||
}
|
||||
getAnnounceList();
|
||||
// 新闻列表
|
||||
function getNewsList() {
|
||||
$.ajax({
|
||||
url: "/console/v1/news",
|
||||
method: "get",
|
||||
data: {
|
||||
page: 1,
|
||||
limit: 5,
|
||||
},
|
||||
success: function (res) {
|
||||
const announceList = res.data.list;
|
||||
announceList.forEach((item, index) => {
|
||||
$("#newsList").append(`
|
||||
<div class="news-item">
|
||||
<div class="fboxRow Ycenter">
|
||||
<div class="number">${index + 1}</div>
|
||||
<a href="./news-details.html?id=${item.id}">
|
||||
<div class="title font-ell1">${item.title}</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="time">${formateTimeFun(item.create_time)}</div>
|
||||
</div>
|
||||
`);
|
||||
});
|
||||
},
|
||||
});
|
||||
}
|
||||
getNewsList();
|
||||
|
||||
$("#myTabs a").click(function (e) {
|
||||
e.preventDefault();
|
||||
$(this).tab("show");
|
||||
});
|
||||
// 跳转函数
|
||||
function goOtherPage(url) {
|
||||
location.href = url;
|
||||
}
|
||||
$("#cloud-box").click(function () {
|
||||
location.href = "cloud.html";
|
||||
});
|
||||
$("#domain-box").click(function () {
|
||||
location.href = "domain.html";
|
||||
});
|
||||
$("#recomment-box").click(function () {
|
||||
location.href = "/home.htm";
|
||||
});
|
||||
$("#logon-box").click(function () {
|
||||
location.href = "/regist.htm";
|
||||
});
|
||||
$("#cps-box").click(function () {
|
||||
location.href = "partner/cps.html";
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user