fix: 修复页面加载时的样式跳变问题
- 在 header.php 中添加预加载脚本,页面渲染前应用用户样式设置 - 优化强制刷新逻辑,避免二次刷新 - 移除 argontheme.js 中重复的样式应用代码 - 修复字体、阴影、滤镜、UI 样式的闪烁问题
This commit is contained in:
@@ -831,11 +831,8 @@ if (argonConfig.waterflow_columns != "1") {
|
||||
$("html").addClass("use-serif");
|
||||
localStorage['Argon_Use_Serif'] = "true";
|
||||
});
|
||||
if (localStorage['Argon_Use_Serif'] == "true"){
|
||||
$("html").addClass("use-serif");
|
||||
}else if (localStorage['Argon_Use_Serif'] == "false"){
|
||||
$("html").removeClass("use-serif");
|
||||
}
|
||||
// 字体设置已在 header.php 中预加载,此处无需重复应用
|
||||
|
||||
//阴影
|
||||
$("#blog_setting_shadow_small").on("click" , function(){
|
||||
$("html").removeClass("use-big-shadow");
|
||||
@@ -845,11 +842,7 @@ if (argonConfig.waterflow_columns != "1") {
|
||||
$("html").addClass("use-big-shadow");
|
||||
localStorage['Argon_Use_Big_Shadow'] = "true";
|
||||
});
|
||||
if (localStorage['Argon_Use_Big_Shadow'] == "true"){
|
||||
$("html").addClass("use-big-shadow");
|
||||
}else if (localStorage['Argon_Use_Big_Shadow'] == "false"){
|
||||
$("html").removeClass("use-big-shadow");
|
||||
}
|
||||
// 阴影设置已在 header.php 中预加载,此处无需重复应用
|
||||
//滤镜
|
||||
function setBlogFilter(name){
|
||||
if (name == undefined || name == ""){
|
||||
@@ -865,7 +858,9 @@ if (argonConfig.waterflow_columns != "1") {
|
||||
$("#blog_setting_filters .blog-setting-filter-btn[filter-name='" + name + "']").addClass("active");
|
||||
localStorage['Argon_Filter'] = name;
|
||||
}
|
||||
setBlogFilter(localStorage['Argon_Filter']);
|
||||
// 滤镜设置已在 header.php 中预加载,此处只需设置按钮状态
|
||||
let currentFilter = localStorage['Argon_Filter'] || 'off';
|
||||
$("#blog_setting_filters .blog-setting-filter-btn[filter-name='" + currentFilter + "']").addClass("active");
|
||||
$(".blog-setting-filter-btn").on("click" , function(){
|
||||
setBlogFilter(this.getAttribute("filter-name"));
|
||||
});
|
||||
@@ -883,7 +878,9 @@ if (argonConfig.waterflow_columns != "1") {
|
||||
$(".blog-setting-style-btn[style-name='" + style + "']").addClass("active");
|
||||
localStorage['Argon_UI_Style'] = style;
|
||||
}
|
||||
setUIStyle(localStorage['Argon_UI_Style']);
|
||||
// UI 样式设置已在 header.php 中预加载,此处只需设置按钮状态
|
||||
let currentUIStyle = localStorage['Argon_UI_Style'] || 'default';
|
||||
$(".blog-setting-style-btn[style-name='" + currentUIStyle + "']").addClass("active");
|
||||
$(".blog-setting-style-btn").on("click" , function(){
|
||||
setUIStyle(this.getAttribute("style-name"));
|
||||
});
|
||||
|
||||
75
header.php
75
header.php
@@ -254,7 +254,39 @@
|
||||
|
||||
<meta name="theme-version" content="<?php echo $GLOBALS['theme_version']; ?>">
|
||||
|
||||
|
||||
<!-- 预加载用户样式设置 - 避免样式跳变 -->
|
||||
<script>
|
||||
(function() {
|
||||
var html = document.documentElement;
|
||||
var ls = localStorage;
|
||||
|
||||
// 字体设置
|
||||
if (ls.getItem('Argon_Use_Serif') === 'true') {
|
||||
html.classList.add('use-serif');
|
||||
} else if (ls.getItem('Argon_Use_Serif') === 'false') {
|
||||
html.classList.remove('use-serif');
|
||||
}
|
||||
|
||||
// 阴影设置
|
||||
if (ls.getItem('Argon_Use_Big_Shadow') === 'true') {
|
||||
html.classList.add('use-big-shadow');
|
||||
} else if (ls.getItem('Argon_Use_Big_Shadow') === 'false') {
|
||||
html.classList.remove('use-big-shadow');
|
||||
}
|
||||
|
||||
// 滤镜设置
|
||||
var filter = ls.getItem('Argon_Filter');
|
||||
if (filter && filter !== 'off') {
|
||||
html.classList.add('filter-' + filter);
|
||||
}
|
||||
|
||||
// UI 样式设置
|
||||
var uiStyle = ls.getItem('Argon_UI_Style');
|
||||
if (uiStyle && uiStyle !== 'default') {
|
||||
html.classList.add('style-' + uiStyle);
|
||||
}
|
||||
})();
|
||||
</script>
|
||||
|
||||
<link rel="profile" href="http://gmpg.org/xfn/11">
|
||||
|
||||
@@ -302,7 +334,37 @@
|
||||
|
||||
// 版本变化时清除所有缓存
|
||||
if (lastVersion !== currentVersion) {
|
||||
// 如果不是首次访问且需要刷新,先标记再刷新
|
||||
if (lastVersion !== null) {
|
||||
// 设置刷新标记
|
||||
sessionStorage.setItem('argon_needs_refresh', '1');
|
||||
|
||||
// 清除 sessionStorage 中的其他数据
|
||||
var needsRefresh = sessionStorage.getItem('argon_needs_refresh');
|
||||
try {
|
||||
var keys = Object.keys(sessionStorage);
|
||||
keys.forEach(function(key) {
|
||||
if (key !== 'argon_needs_refresh') {
|
||||
sessionStorage.removeItem(key);
|
||||
}
|
||||
});
|
||||
} catch(e) {}
|
||||
|
||||
// 更新版本号
|
||||
localStorage.setItem(forceRefreshKey, currentVersion);
|
||||
|
||||
// 强制硬刷新(绕过缓存)
|
||||
window.location.reload(true);
|
||||
return; // 阻止后续代码执行
|
||||
}
|
||||
|
||||
// 首次访问,只更新版本号
|
||||
localStorage.setItem(forceRefreshKey, currentVersion);
|
||||
}
|
||||
|
||||
// 检查是否是刷新后的页面
|
||||
if (sessionStorage.getItem('argon_needs_refresh') === '1') {
|
||||
sessionStorage.removeItem('argon_needs_refresh');
|
||||
|
||||
// 清除 Service Worker 缓存
|
||||
if ('caches' in window) {
|
||||
@@ -321,17 +383,6 @@
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// 如果不是首次访问,强制硬刷新
|
||||
if (lastVersion !== null) {
|
||||
// 清除 sessionStorage
|
||||
try { sessionStorage.clear(); } catch(e) {}
|
||||
|
||||
// 强制硬刷新(绕过缓存)
|
||||
if (window.location.reload) {
|
||||
window.location.reload(true);
|
||||
}
|
||||
}
|
||||
}
|
||||
})();
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user