弹窗样式修改

This commit is contained in:
底层用户 2022-03-04 18:52:51 +08:00
parent 427c9ff678
commit 0fc2ad45a4
7 changed files with 82 additions and 40 deletions

1
.gitignore vendored Normal file
View File

@ -0,0 +1 @@
.vscode

View File

@ -249,6 +249,13 @@
}
}
/* 大于568px时 */
@media (min-width: 568px) {
.iziToast {
border-radius: 30px !important;
}
}
/* 大于720px时 */
@media (min-width: 720px) {

View File

@ -737,7 +737,6 @@ footer {
/*弹窗样式*/
.iziToast {
background: rgb(0 0 0 / 45%) !important;
backdrop-filter: blur(10px) !important;
}
@ -757,8 +756,10 @@ footer {
box-shadow: none !important;
}
.iziToast-message.slideIn {
margin-top: 8px !important;
.iziToast>.iziToast-body .iziToast-texts {
margin: 6px 6px !important;
display: flex !important;
align-items: center;
}
.iziToast-message {

BIN
img/music.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.6 KiB

View File

@ -1,7 +1,35 @@
//加载动画
//弹窗样式
iziToast.settings({
timeout: 10000,
progressBar: false,
close: false,
closeOnEscape: true,
position: 'topCenter',
transitionIn: 'bounceInDown',
transitionOut: 'flipOutX',
displayMode: 'replace',
layout: '1',
backgroundColor: '#00000040',
titleColor: '#efefef',
messageColor: '#efefef',
iconColor: '#efefef',
});
//加载完成后执行
window.addEventListener('load', function () {
//载入动画
$('#loading-box').attr('class', 'loaded');
$('#section').css("cssText", "transform: scale(1) !important;opacity: 1 !important;filter: blur(0px) !important");
//用户欢迎
setTimeout(function () {
iziToast.show({
timeout: 2500,
title: hello,
message: '欢迎来到我的主页'
});
}, 800);
}, false)
setTimeout(function () {
@ -34,20 +62,6 @@ new_element.setAttribute("src","./js/lantern.js");
document.body.appendChild(new_element);
*/
//弹窗样式
iziToast.settings({
timeout: 10000,
closeOnEscape: 'true',
position: 'topLeft',
transitionIn: 'bounceInRight',
transitionOut: 'fadeOutLeft',
displayMode: 'replace',
layout: '2',
titleColor: '#efefef',
messageColor: '#efefef',
iconColor: '#efefef',
});
//火狐浏览器独立样式
if (isFirefox = navigator.userAgent.indexOf("Firefox") > 0) {
var head = document.getElementsByTagName('head')[0];
@ -57,10 +71,9 @@ if (isFirefox = navigator.userAgent.indexOf("Firefox") > 0) {
link.type = 'text/css';
head.appendChild(link);
window.addEventListener('load', function () {
iziToast.info({
iziToast.show({
timeout: 8000,
iconUrl: './img/warn.png',
title: '兼容提醒',
message: '您正在使用火狐浏览器,部分功能可能不支持'
});
}, false)
@ -254,10 +267,9 @@ $("#more").hover(function () {
//屏蔽右键
document.oncontextmenu = function () {
iziToast.info({
timeout: 4000,
iziToast.show({
timeout: 2000,
iconUrl: './img/warn.png',
title: '温馨提醒',
message: '为了浏览体验,本站禁用右键'
});
return false;
@ -277,11 +289,10 @@ for (var day of days) {
$("#change").html("Silence in silence");
$("#change1").html("今天是中国国家纪念日,全站已切换为黑白模式");
window.addEventListener('load', function () {
iziToast.info({
iziToast.show({
timeout: 14000,
iconUrl: './img/candle.png',
title: '今天是中国国家纪念日',
message: '历史不会忘记,人民永远铭记!'
message: '今天是中国国家纪念日'
});
}, false);
}

View File

@ -3,7 +3,7 @@ const ap = new APlayer({
order: 'random',
preload: 'auto',
listMaxHeight: '336px',
volume: 0.5,
volume: '0.5',
mutex: true,
lrcType: 3,
/* 下方更改为你自己的歌单就行 */
@ -256,11 +256,19 @@ const ap = new APlayer({
theme: "#b3dae1"
},
{
name: "你不是真正的快乐",
name: "知足",
artist: "五月天",
url: "https://drive.imsyy.top/api?path=%2F%E9%9F%B3%E4%B9%90%2F%E6%96%87%E4%BB%B6%E5%BC%95%E7%94%A8%2F%E4%BA%94%E6%9C%88%E5%A4%A9-%E4%BD%A0%E4%B8%8D%E6%98%AF%E7%9C%9F%E6%AD%A3%E7%9A%84%E5%BF%AB%E4%B9%90.mp3&raw=true",
cover: "https://y.gtimg.cn/music/photo_new/T002R300x300M0000020I7sO0ayXhN_1.jpg?max_age=2592000",
lrc: "https://s-sh-2127-music.oss.dogecdn.com/lrc%2F%E4%BA%94%E6%9C%88%E5%A4%A9-%E4%BD%A0%E4%B8%8D%E6%98%AF%E7%9C%9F%E6%AD%A3%E7%9A%84%E5%BF%AB%E4%B9%90.lrc",
url: "https://drive.imsyy.top/api/raw/?path=/音乐/文件引用/五月天-知足.mp3",
cover: "https://y.qq.com/music/photo_new/T002R300x300M0000020I7sO0ayXhN_1.jpg?max_age=2592000",
lrc: "https://s-sh-2127-music.oss.dogecdn.com/lrc%2F%E4%BA%94%E6%9C%88%E5%A4%A9-%E7%9F%A5%E8%B6%B3.lrc",
theme: "#0a0708"
},
{
name: "如烟",
artist: "五月天",
url: "https://drive.imsyy.top/api/raw/?path=/音乐/文件引用/五月天-如烟.mp3",
cover: "https://y.qq.com/music/photo_new/T002R300x300M0000020I7sO0ayXhN_1.jpg?max_age=2592000",
lrc: "https://s-sh-2127-music.oss.dogecdn.com/lrc%2F%E4%BA%94%E6%9C%88%E5%A4%A9-%E5%A6%82%E7%83%9F.lrc",
theme: "#0a0708"
},
{
@ -411,11 +419,10 @@ setInterval(function () {
ap.on('play', function () {
music = $(".aplayer-title").text() + $(".aplayer-author").text();
iziToast.info({
timeout: 6000,
iconUrl: './img/play.png',
timeout: 8000,
iconUrl: './img/music.png',
displayMode: 'replace',
title: '音乐通知',
message: '正在播放:' + ' ' + music
message: music
});
$("#play").html("<i class='iconfont icon-pause'>");
$("#music-name").html($(".aplayer-title").text() + $(".aplayer-author").text());
@ -434,10 +441,6 @@ ap.on('pause', function () {
});
//音量调节
$(document).ready(function () {
$('#volume').val(0.5);
})
function changevolume() {
var x = $("#volume").val();
ap.volume(x, true);

View File

@ -47,3 +47,22 @@ function init_life_time() {
}, 1000);
}
init_life_time()
now = new Date(), hour = now.getHours()
if (hour < 6) {
var hello = "凌晨好";
} else if (hour < 9) {
var hello = "早上好";
} else if (hour < 12) {
var hello = "上午好";
} else if (hour < 14) {
var hello = "中午好";
} else if (hour < 17) {
var hello = "下午好";
} else if (hour < 19) {
var hello = "傍晚好";
} else if (hour < 22) {
var hello = "晚上好";
} else {
var hello = "夜深了";
}