😮大致也许实现了功能！
This commit is contained in:
parent
22bfe9f333
commit
d6aecc34bf
@ -16,7 +16,7 @@
|
|||||||
<!-- 模态框结构 -->
|
<!-- 模态框结构 -->
|
||||||
<div id="modal" class="modal">
|
<div id="modal" class="modal">
|
||||||
<div class="modal-content">
|
<div class="modal-content">
|
||||||
<img id="modal-author-avatar" src="modal-author-avatar" alt="">
|
<img id="modal-author-avatar" src="" alt="">
|
||||||
<a id="modal-author-name-link"></a>
|
<a id="modal-author-name-link"></a>
|
||||||
<div id="modal-articles-container"></div>
|
<div id="modal-articles-container"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
356
src/fclite.css
Normal file
356
src/fclite.css
Normal file
@ -0,0 +1,356 @@
|
|||||||
|
/* 公共颜色变量 */
|
||||||
|
:root {
|
||||||
|
--text-color-light: #000000;
|
||||||
|
--text-color-dark: #F7F7FA;
|
||||||
|
--background-color-light: #f4f4f9;
|
||||||
|
--background-color-dark: #181818;
|
||||||
|
--container-bg-color-light: white;
|
||||||
|
--container-bg-color-dark: #1D1E22;
|
||||||
|
--hover-color: #3498db;
|
||||||
|
--author-color-light: gray;
|
||||||
|
--author-color-dark: #b3b3b3;
|
||||||
|
--modal-bg-blur: 25px;
|
||||||
|
--shadow-color-light: rgba(0, 0, 0, 0.1);
|
||||||
|
--shadow-color-dark: rgba(255, 255, 255, 0.1);
|
||||||
|
--border-color-light: #e3e8f7;
|
||||||
|
--border-color-dark: #42444a;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 浅色模式颜色 */
|
||||||
|
[data-theme=light] {
|
||||||
|
--text-color: var(--text-color-light);
|
||||||
|
--background-color: var(--background-color-light);
|
||||||
|
--tag-bg-color: #bfbfbf;
|
||||||
|
--container-bg-color: var(--container-bg-color-light);
|
||||||
|
--author-color: var(--author-color-light);
|
||||||
|
--shadow-color: var(--shadow-color-light);
|
||||||
|
--border-color: var(--border-color-light);
|
||||||
|
--modal-bg-color: rgba(255, 255, 255, 0.5);
|
||||||
|
--modal-content-bg-color: rgba(239, 250, 255, 0.7);
|
||||||
|
--load-more-btn-bg-color: var(--container-bg-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 深色模式颜色 */
|
||||||
|
[data-theme=dark] {
|
||||||
|
--text-color: var(--text-color-dark);
|
||||||
|
--background-color: var(--background-color-dark);
|
||||||
|
--tag-bg-color: #474747;
|
||||||
|
--container-bg-color: var(--container-bg-color-dark);
|
||||||
|
--author-color: var(--author-color-dark);
|
||||||
|
--shadow-color: var(--shadow-color-dark);
|
||||||
|
--border-color: var(--border-color-dark);
|
||||||
|
--modal-bg-color: rgba(0, 0, 0, 0.3);
|
||||||
|
--modal-content-bg-color: rgba(20, 20, 20, 0.5);
|
||||||
|
--load-more-btn-bg-color: var(--container-bg-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
background-color: var(--background-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
#friend-circle-lite-root {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 随机友链文章卡片 */
|
||||||
|
#random-article {
|
||||||
|
display: flex;
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
margin: 8px 0;
|
||||||
|
background-color: var(--container-bg-color);
|
||||||
|
border-radius: 10px;
|
||||||
|
border:1px solid var(--border-color);
|
||||||
|
height: 210px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.random-container {
|
||||||
|
position: relative;
|
||||||
|
margin: 20px;
|
||||||
|
width: 100%;
|
||||||
|
height: 170px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.random-container:hover .random-title {
|
||||||
|
font-size: 32px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.random-author {
|
||||||
|
font-size: 14px;
|
||||||
|
color: var(--author-color);
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.random-container-title {
|
||||||
|
font-size: 20px;
|
||||||
|
font-weight: 700;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.random-title {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
font-size: 30px;
|
||||||
|
transition: font-size 0.3s ease-in-out;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
|
||||||
|
.random-link-button {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 20px;
|
||||||
|
right: 20px;
|
||||||
|
padding: 10px 20px;
|
||||||
|
border: none;
|
||||||
|
border-radius: 20px;
|
||||||
|
background-color: var(--hover-color);
|
||||||
|
color: #fff;
|
||||||
|
cursor: pointer;
|
||||||
|
font-size: 14px;
|
||||||
|
transition: background-color 0.3s ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 模态框样式 */
|
||||||
|
.modal {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background-color: var(--modal-bg-color);
|
||||||
|
backdrop-filter: blur(var(--modal-bg-blur));
|
||||||
|
-webkit-backdrop-filter: blur(var(--modal-bg-blur));
|
||||||
|
z-index: 999;
|
||||||
|
opacity: 0;
|
||||||
|
visibility: hidden;
|
||||||
|
transition: opacity 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-open {
|
||||||
|
opacity: 1;
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-content {
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
width: 400px;
|
||||||
|
background-color: var(--modal-content-bg-color);
|
||||||
|
padding: 20px;
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
z-index: 1000;
|
||||||
|
max-height: 95%;
|
||||||
|
overflow-y: auto;
|
||||||
|
border-radius: 20px;
|
||||||
|
transition: opacity 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 400px) {
|
||||||
|
.modal-content {
|
||||||
|
width: 80%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#modal-author-avatar {
|
||||||
|
display: block;
|
||||||
|
margin: 0 auto 10px;
|
||||||
|
border-radius: 50%;
|
||||||
|
width: 80px;
|
||||||
|
height: 80px;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
#modal-author-name-link {
|
||||||
|
display: block;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 15px;
|
||||||
|
margin: 25px 0;
|
||||||
|
color: var(--hover-color);
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#modal-author-name-link:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-content hr {
|
||||||
|
margin: 20px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#modal-articles-container {
|
||||||
|
border-top: var(--hover-color) double 2px;
|
||||||
|
margin-top: 20px;
|
||||||
|
padding-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-article {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
border-bottom: var(--hover-color) dashed 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-article .modal-article-title {
|
||||||
|
font-size: 18px;
|
||||||
|
line-height: 1.2;
|
||||||
|
cursor: pointer;
|
||||||
|
height: 2.5em;
|
||||||
|
width: 100%;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
text-decoration: none;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-article .modal-article-title:hover {
|
||||||
|
color: var(--hover-color);
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-article .modal-article-date {
|
||||||
|
font-size: 12px;
|
||||||
|
width: 100%;
|
||||||
|
color: var(--author-color);
|
||||||
|
padding: 5px;
|
||||||
|
cursor: default;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 其他样式... */
|
||||||
|
.articles-container {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
|
||||||
|
gap: 8px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card {
|
||||||
|
background-color: var(--container-bg-color);
|
||||||
|
border-radius: 10px;
|
||||||
|
padding: 10px;
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-between;
|
||||||
|
height: 150px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-title {
|
||||||
|
z-index: 1;
|
||||||
|
font-size: 17px;
|
||||||
|
color: var(--text-color);
|
||||||
|
font-weight: 520;
|
||||||
|
cursor: pointer;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
line-height: 1.5;
|
||||||
|
max-height: 4.5em;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 3;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
transition: color 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-title:hover {
|
||||||
|
color: var(--hover-color);
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-author,
|
||||||
|
.card-date {
|
||||||
|
font-size: 12px;
|
||||||
|
color: var(--author-color);
|
||||||
|
padding: 5px;
|
||||||
|
transition: box-shadow 0.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-author:hover {
|
||||||
|
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-author {
|
||||||
|
cursor: pointer;
|
||||||
|
background-color: var(--background-color);
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
border-radius: 15px;
|
||||||
|
display: flex;
|
||||||
|
padding-right: 10px;
|
||||||
|
width: fit-content;
|
||||||
|
height: 26px;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#friend-circle-lite-root .card-author img {
|
||||||
|
border-radius: 50%;
|
||||||
|
width: 15px;
|
||||||
|
height: 15px;
|
||||||
|
margin: 0 2px !important;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-date {
|
||||||
|
position: absolute;
|
||||||
|
z-index: 1;
|
||||||
|
bottom: 5px;
|
||||||
|
cursor: default;
|
||||||
|
right: 10px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#friend-circle-lite-root .card-bg {
|
||||||
|
cursor: default;
|
||||||
|
z-index: 0;
|
||||||
|
border-radius: 50%;
|
||||||
|
margin: 0;
|
||||||
|
position: absolute;
|
||||||
|
bottom: -20px;
|
||||||
|
right: -16px;
|
||||||
|
width: 140px;
|
||||||
|
height: 140px;
|
||||||
|
opacity: 0.4;
|
||||||
|
}
|
||||||
|
|
||||||
|
#load-more-btn {
|
||||||
|
color: var(--text-color);
|
||||||
|
font-size: 15px;
|
||||||
|
background-color: var(--container-bg-color);
|
||||||
|
cursor: pointer;
|
||||||
|
width: 200px;
|
||||||
|
border-radius: 20px;
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
padding: 3px;
|
||||||
|
transition: all 0.3s;
|
||||||
|
margin: 20px auto;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
#load-more-btn:hover {
|
||||||
|
background-color: var(--hover-color);
|
||||||
|
width: 300px;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
#stats-container {
|
||||||
|
font-size: 13px;
|
||||||
|
text-align: right;
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#stats-container > * {
|
||||||
|
margin-bottom: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#stats-container a {
|
||||||
|
color: var(--author-color);
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
203
src/fclite.js
Normal file
203
src/fclite.js
Normal file
@ -0,0 +1,203 @@
|
|||||||
|
function initialize_fc_lite() {
|
||||||
|
const root = document.getElementById('friend-circle-lite-root');
|
||||||
|
|
||||||
|
const randomArticleContainer = document.createElement('div');
|
||||||
|
randomArticleContainer.id = 'random-article';
|
||||||
|
root.appendChild(randomArticleContainer);
|
||||||
|
|
||||||
|
const container = document.createElement('div');
|
||||||
|
container.className = 'articles-container';
|
||||||
|
container.id = 'articles-container';
|
||||||
|
root.appendChild(container);
|
||||||
|
|
||||||
|
const loadMoreBtn = document.createElement('button');
|
||||||
|
loadMoreBtn.id = 'load-more-btn';
|
||||||
|
loadMoreBtn.innerText = '显示更多';
|
||||||
|
root.appendChild(loadMoreBtn);
|
||||||
|
|
||||||
|
// 创建模态框结构
|
||||||
|
const modal = document.createElement('div');
|
||||||
|
modal.id = 'modal';
|
||||||
|
modal.className = 'modal';
|
||||||
|
modal.innerHTML = `
|
||||||
|
<div class="modal-content">
|
||||||
|
<img id="modal-author-avatar" src="" alt="">
|
||||||
|
<a id="modal-author-name-link"></a>
|
||||||
|
<div id="modal-articles-container"></div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
document.body.appendChild(modal); // this.body 改为 document.body
|
||||||
|
|
||||||
|
// 创建统计信息容器
|
||||||
|
const statsContainer = document.createElement('div');
|
||||||
|
statsContainer.id = 'stats-container';
|
||||||
|
root.appendChild(statsContainer);
|
||||||
|
|
||||||
|
let start = 0; // 记录加载起始位置
|
||||||
|
let allArticles = []; // 存储所有文章
|
||||||
|
|
||||||
|
function loadMoreArticles() {
|
||||||
|
const cacheKey = 'friend-circle-lite-cache';
|
||||||
|
const cacheTimeKey = 'friend-circle-lite-cache-time';
|
||||||
|
const cacheTime = localStorage.getItem(cacheTimeKey);
|
||||||
|
const now = new Date().getTime();
|
||||||
|
|
||||||
|
if (cacheTime && (now - cacheTime < 10 * 60 * 1000)) { // 缓存时间小于10分钟
|
||||||
|
const cachedData = JSON.parse(localStorage.getItem(cacheKey));
|
||||||
|
if (cachedData) {
|
||||||
|
processArticles(cachedData);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
fetch(`${UserConfig.private_api_url}all.json`)
|
||||||
|
.then(response => response.json())
|
||||||
|
.then(data => {
|
||||||
|
localStorage.setItem(cacheKey, JSON.stringify(data));
|
||||||
|
localStorage.setItem(cacheTimeKey, now.toString());
|
||||||
|
processArticles(data);
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
loadMoreBtn.innerText = '显示更多'; // 恢复按钮文本
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function processArticles(data) {
|
||||||
|
allArticles = data.article_data;
|
||||||
|
// 处理统计数据
|
||||||
|
const stats = data.statistical_data;
|
||||||
|
statsContainer.innerHTML = `
|
||||||
|
<div>Powered by: <a href="https://github.com/willow-god/Friend-Circle-Lite" target="_blank">FriendCircleLite</a><br></div>
|
||||||
|
<div>Designed By: <a href="https://www.qyliu.top/" target="_blank">LiuShen</a><br></div>
|
||||||
|
<div>订阅:${stats.friends_num} 活跃:${stats.active_num} 总文章数:${stats.article_num}<br></div>
|
||||||
|
<div>更新时间:${stats.last_updated_time}</div>
|
||||||
|
`;
|
||||||
|
|
||||||
|
// 随机友链卡片
|
||||||
|
const randomArticle = allArticles[Math.floor(Math.random() * allArticles.length)];
|
||||||
|
randomArticleContainer.innerHTML = `
|
||||||
|
<div class="random-container">
|
||||||
|
<div class="random-container-title">随机钓鱼</div>
|
||||||
|
<div class="random-title">${randomArticle.title}</div>
|
||||||
|
<div class="random-author">作者: ${randomArticle.author}</div>
|
||||||
|
</div>
|
||||||
|
<button class="random-link-button" onclick="window.open('${randomArticle.link}', '_blank')">过去转转</button>
|
||||||
|
`;
|
||||||
|
|
||||||
|
const articles = allArticles.slice(start, start + UserConfig.page_turning_number);
|
||||||
|
|
||||||
|
articles.forEach(article => {
|
||||||
|
const card = document.createElement('div');
|
||||||
|
card.className = 'card';
|
||||||
|
|
||||||
|
const title = document.createElement('div');
|
||||||
|
title.className = 'card-title';
|
||||||
|
title.innerText = article.title;
|
||||||
|
card.appendChild(title);
|
||||||
|
title.onclick = () => window.open(article.link, '_blank');
|
||||||
|
|
||||||
|
const author = document.createElement('div');
|
||||||
|
author.className = 'card-author';
|
||||||
|
const authorImg = document.createElement('img');
|
||||||
|
authorImg.className = 'no-lightbox';
|
||||||
|
authorImg.src = article.avatar || UserConfig.error_img; // 使用默认头像
|
||||||
|
authorImg.onerror = () => authorImg.src = UserConfig.error_img; // 头像加载失败时使用默认头像
|
||||||
|
author.appendChild(authorImg);
|
||||||
|
author.appendChild(document.createTextNode(article.author));
|
||||||
|
card.appendChild(author);
|
||||||
|
|
||||||
|
author.onclick = () => {
|
||||||
|
showAuthorArticles(article.author, article.avatar, article.link);
|
||||||
|
};
|
||||||
|
|
||||||
|
const date = document.createElement('div');
|
||||||
|
date.className = 'card-date';
|
||||||
|
date.innerText = article.created.substring(0, 10);
|
||||||
|
card.appendChild(date);
|
||||||
|
|
||||||
|
const bgImg = document.createElement('img');
|
||||||
|
bgImg.className = 'card-bg no-lightbox';
|
||||||
|
bgImg.src = article.avatar || UserConfig.error_img;
|
||||||
|
bgImg.onerror = () => bgImg.src = UserConfig.error_img; // 头像加载失败时使用默认头像
|
||||||
|
card.appendChild(bgImg);
|
||||||
|
|
||||||
|
container.appendChild(card);
|
||||||
|
});
|
||||||
|
|
||||||
|
start += UserConfig.page_turning_number;
|
||||||
|
|
||||||
|
if (start >= allArticles.length) {
|
||||||
|
loadMoreBtn.style.display = 'none'; // 隐藏按钮
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function showAuthorArticles(author, avatar, link) {
|
||||||
|
const modal = document.getElementById('modal');
|
||||||
|
const modalArticlesContainer = document.getElementById('modal-articles-container');
|
||||||
|
const modalAuthorAvatar = document.getElementById('modal-author-avatar');
|
||||||
|
const modalAuthorNameLink = document.getElementById('modal-author-name-link');
|
||||||
|
|
||||||
|
modalArticlesContainer.innerHTML = ''; // 清空之前的内容
|
||||||
|
modalAuthorAvatar.src = avatar || UserConfig.error_img; // 使用默认头像
|
||||||
|
modalAuthorAvatar.onerror = () => modalAuthorAvatar.src = UserConfig.error_img; // 头像加载失败时使用默认头像
|
||||||
|
modalAuthorNameLink.innerText = author;
|
||||||
|
modalAuthorNameLink.href = new URL(link).origin;
|
||||||
|
|
||||||
|
const authorArticles = allArticles.filter(article => article.author === author);
|
||||||
|
authorArticles.forEach(article => {
|
||||||
|
const articleDiv = document.createElement('div');
|
||||||
|
articleDiv.className = 'modal-article';
|
||||||
|
|
||||||
|
const title = document.createElement('a');
|
||||||
|
title.className = 'modal-article-title';
|
||||||
|
title.innerText = article.title;
|
||||||
|
title.href = article.link;
|
||||||
|
title.target = '_blank';
|
||||||
|
articleDiv.appendChild(title);
|
||||||
|
|
||||||
|
const date = document.createElement('div');
|
||||||
|
date.className = 'modal-article-date';
|
||||||
|
date.innerText = "--" + article.created.substring(0, 10);
|
||||||
|
articleDiv.appendChild(date);
|
||||||
|
|
||||||
|
modalArticlesContainer.appendChild(articleDiv);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 设置类名以触发显示动画
|
||||||
|
modal.style.display = 'block';
|
||||||
|
setTimeout(() => {
|
||||||
|
modal.classList.add('modal-open');
|
||||||
|
}, 10); // 确保显示动画触发
|
||||||
|
}
|
||||||
|
|
||||||
|
// 隐藏模态框的函数
|
||||||
|
function hideModal() {
|
||||||
|
const modal = document.getElementById('modal');
|
||||||
|
modal.classList.remove('modal-open');
|
||||||
|
modal.addEventListener('transitionend', () => {
|
||||||
|
modal.style.display = 'none';
|
||||||
|
}, { once: true });
|
||||||
|
}
|
||||||
|
|
||||||
|
// 初始加载
|
||||||
|
loadMoreArticles();
|
||||||
|
|
||||||
|
// 加载更多按钮点击事件
|
||||||
|
loadMoreBtn.addEventListener('click', loadMoreArticles);
|
||||||
|
|
||||||
|
// 点击遮罩层关闭模态框
|
||||||
|
window.onclick = function(event) {
|
||||||
|
const modal = document.getElementById('modal');
|
||||||
|
if (event.target === modal) {
|
||||||
|
hideModal();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
document.addEventListener("DOMContentLoaded", function() {
|
||||||
|
initialize_fc_lite();
|
||||||
|
});
|
||||||
|
|
||||||
|
document.addEventListener('pjax:complete', function() {
|
||||||
|
initialize_fc_lite();
|
||||||
|
});
|
||||||
3
src/fclite.min.css
vendored
Normal file
3
src/fclite.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
1
src/fclite.min.js
vendored
Normal file
1
src/fclite.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
Loading…
x
Reference in New Issue
Block a user