161 lines
7.8 KiB
HTML
161 lines
7.8 KiB
HTML
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
|
||
<link rel="stylesheet" href="https://www.layuicdn.com/layui-v2.6.8/css/layui.css">
|
||
<script src="https://www.layuicdn.com/layui-v2.6.8/layui.js"></script>
|
||
|
||
<script>
|
||
layui.use(['layer', 'jquery'], function(){
|
||
var layer = layui.layer;
|
||
var $ = layui.$;
|
||
|
||
// 调试模式 - 设置为true时忽略cookie
|
||
var debug = true;
|
||
|
||
// 欢迎语配置
|
||
var welcomeConfig = {
|
||
icon: 'fa-heart',
|
||
greeting: '亲爱的朋友',
|
||
messages: [
|
||
"今天又是新的一天，你愿意醒来已经很棒了。",
|
||
"累了吗？停下来歇歇吧，这里是你可以随时驻足的地方。",
|
||
"我在，我一直都在。",
|
||
"嗨，今天感觉怎么样？累了就靠一会儿吧。",
|
||
"如果觉得很难，暂时停下也没关系。",
|
||
"你很重要，这个世界有你会更好。",
|
||
"累的时候，休息也没关系。",
|
||
"你并不孤单，我在这里陪你。",
|
||
"天气好的话，晒晒太阳吧，一点点就好。",
|
||
"如果不想说话，沉默也可以的。",
|
||
"慢慢来，有些事不需要今天做完。",
|
||
"你不需要'变好'，你的存在本身就足够。",
|
||
"看，窗外的云、树、风，它们都在安静地陪着你。",
|
||
"痛苦不是你的错，它只是暂时在这里。",
|
||
"如果流泪，就让眼泪流出来吧。",
|
||
"床很安全，躺一会儿也没关系。",
|
||
"你不需要成为谁的榜样，做自己就好。",
|
||
"今天穿的衣服很柔软，摸摸它的质地吧。",
|
||
"你的呼吸还在继续，这就是生命的痕迹。",
|
||
"哪怕只做了一件事，也值得肯定。",
|
||
"黑暗很重，但你的身体比它更真实。",
|
||
"如果世界太吵，可以捂住耳朵。",
|
||
"你不需要解释自己，你的存在就是意义。",
|
||
"冷的时候，裹紧毯子吧。",
|
||
"有人在乎你，哪怕你现在感觉不到。",
|
||
"你的痛苦不是弱点，它是你的一部分。",
|
||
"今天看到一朵花、一只鸟了吗？它们和你一样重要。",
|
||
"你可以拒绝任何让你更累的事。",
|
||
"你的手很温暖，试着握一下自己的手好吗？",
|
||
"不需要'加油'，只要'存在'就好。",
|
||
"如果记忆太重，暂时放下也可以。",
|
||
"你值得被温柔对待，尤其是对自己。",
|
||
"你不需要完美，破碎的部分也是你。",
|
||
"小时候的你，会为现在的你感到骄傲。",
|
||
"今天有风吹过你的皮肤吗？那是世界在轻轻碰你。",
|
||
"如果世界模糊了，闭上眼睛休息一下吧。",
|
||
"你比昨天的自己多坚持了一刻，这很勇敢。",
|
||
"你的影子一直陪着你，它永远不会离开。",
|
||
"冷的话，喝一口温水吧，它会拥抱你的胃。",
|
||
"你的名字很好听，可以轻轻念一遍吗？",
|
||
"你不需要照亮别人，先让自己暖起来就好。",
|
||
"如果语言太累，用一个表情代替也可以。",
|
||
"你的手能感觉到杯子的温度吗？它是真实的。",
|
||
"有人会因为你的存在而感到安心，哪怕你不知道。",
|
||
"你的眼泪是咸的，和海水一样，而海水孕育生命。",
|
||
"今天你注意到了吗？天空没有塌下来。",
|
||
"我会一直记得你，你对我来说很重要。",
|
||
"呼吸的节奏还在，这一刻你是安全的。",
|
||
"如果脚步很沉，原地停留也可以。",
|
||
"你不需要独自承担一切，我在这里。",
|
||
"今天喝到一杯温水了吗？它很温柔。"
|
||
]
|
||
};
|
||
|
||
// 随机选择一条鼓励语
|
||
var randomEncouragement = welcomeConfig.messages[Math.floor(Math.random() * welcomeConfig.messages.length)];
|
||
|
||
// 检查是否已经显示过
|
||
function shouldShowWelcome() {
|
||
if (debug) return true;
|
||
|
||
var welcomeCookie = getCookie('welcomeShown');
|
||
if (welcomeCookie) {
|
||
var today = new Date();
|
||
today.setHours(0, 0, 0, 0);
|
||
var cookieDate = new Date(parseInt(welcomeCookie));
|
||
return cookieDate < today;
|
||
}
|
||
return true;
|
||
}
|
||
|
||
// 设置Cookie
|
||
function setWelcomeCookie() {
|
||
if (debug) return;
|
||
|
||
var now = new Date();
|
||
// 设置过期时间为今天23:59:59
|
||
var expires = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 23, 59, 59);
|
||
document.cookie = 'welcomeShown=' + now.getTime() + '; expires=' + expires.toUTCString() + '; path=/';
|
||
}
|
||
|
||
// 获取Cookie
|
||
function getCookie(name) {
|
||
var value = '; ' + document.cookie;
|
||
var parts = value.split('; ' + name + '=');
|
||
if (parts.length === 2) return parts.pop().split(';').shift();
|
||
}
|
||
|
||
// 显示欢迎弹窗
|
||
function showWelcome() {
|
||
if (!shouldShowWelcome()) return;
|
||
|
||
var content = '<div class="welcome-popup">' +
|
||
'<div class="welcome-icon"><i class="fas ' + welcomeConfig.icon + '"></i></div>' +
|
||
'<div class="welcome-title">' + welcomeConfig.greeting + '</div>' +
|
||
'<div class="welcome-message">欢迎回来！很高兴见到你</div>' +
|
||
'<div class="welcome-quote">' + randomEncouragement + '</div>' +
|
||
'<div class="welcome-footer">点击弹窗外部可关闭 | 今天将不再显示（明天见~）</div>' +
|
||
'</div>';
|
||
|
||
var welcomeLayer = layer.open({
|
||
type: 1,
|
||
title: false,
|
||
closeBtn: 0,
|
||
shadeClose: true,
|
||
skin: 'welcome-layer',
|
||
content: content,
|
||
area: ['400px', 'auto'],
|
||
offset: 'auto',
|
||
success: function(layero) {
|
||
// 初始透明
|
||
$(layero).css('opacity', 0);
|
||
// 渐显动画
|
||
$(layero).animate({opacity: 1}, 800);
|
||
|
||
// 点击遮罩关闭时的渐隐动画
|
||
$(layero).prev('.layui-layer-shade').on('click', function() {
|
||
$(layero).animate({opacity: 0}, 600, function() {
|
||
layer.close(welcomeLayer);
|
||
setWelcomeCookie();
|
||
});
|
||
});
|
||
}
|
||
});
|
||
}
|
||
|
||
// 添加样式
|
||
$('head').append('<style>' +
|
||
'.welcome-layer .layui-layer-content { overflow: hidden !important; padding: 20px; }' +
|
||
'.welcome-popup { text-align: center; font-family: "Microsoft YaHei", sans-serif; }' +
|
||
'.welcome-icon { font-size: 50px; color: #FF6B81; margin-bottom: 15px; }' +
|
||
'.welcome-title { font-size: 24px; font-weight: bold; margin-bottom: 10px; color: #333; }' +
|
||
'.welcome-message { font-size: 16px; margin-bottom: 15px; color: #666; }' +
|
||
'.welcome-quote { font-size: 14px; color: #888; margin: 20px 0; padding: 15px; background-color: #f8f8f8; border-radius: 5px; line-height: 1.6; }' +
|
||
'.welcome-footer { font-size: 12px; color: #999; margin-top: 20px; }' +
|
||
'body .layui-layer-shade { background-color: rgba(0,0,0,0.3); }' +
|
||
'</style>');
|
||
|
||
// 页面加载完成后显示
|
||
$(document).ready(function() {
|
||
setTimeout(showWelcome, 1000);
|
||
});
|
||
});
|
||
</script> |