MyukiGCard是一款鏈接導(dǎo)航卡片，個(gè)人介紹卡片、網(wǎng)頁(yè)遮罩、或是作為網(wǎng)站的消息彈框等等，原生javript開(kāi)發(fā)。簡(jiǎn)單地支持語(yǔ)言設(shè)置、多種夜間模式、鏈接按鈕種類設(shè)置等等。
MyukiGCard
一個(gè)簡(jiǎn)潔美觀的個(gè)人導(dǎo)航主頁(yè)、鏈接卡片
可以是一張名片，個(gè)人網(wǎng)址的導(dǎo)航主頁(yè)、介紹頁(yè)、或是作為網(wǎng)站的引導(dǎo)頁(yè)、消息彈框等等。
<link rel="stylesheet" href="./css/MyukiGCard.css"> <script src="./js/MyukiGCard.js"></script>
<script>
//簡(jiǎn)單用法
//window.MyNavCard = $MGC();
//高級(jí)用法
window.MyNavCard = $MGC({
icon: "https://stackblog.cf/img/avatar.jpg",
/*
icon: 可以是頭像、網(wǎng)站logo等
*/
name: "Stack Dev",
/*
name: 可是是名字、網(wǎng)站名稱等
*/
info: "歡迎使用MyukiGCard",
/*
info: 個(gè)性簽名、網(wǎng)站口號(hào)、信息等，為空或者不設(shè)置將不顯示
默認(rèn)值: 空
*/
z_index: 9999,
/*
不用解釋，默認(rèn)值為9999
*/
blur: "#write",
/*
blur: 想要模糊化處理的頁(yè)面元素，取值可以是.className（類名）、#idName（id屬性值）、tagName（標(biāo)簽名）
*/
lang: "en-US",
/*
lang: 語(yǔ)言設(shè)置，目前和關(guān)閉按鈕的文本有關(guān)
默認(rèn)值: zh-CN
可選值: zh-CN,zh-TW,en-US
如果不提供或者提供的不在可選值內(nèi)，將使用默認(rèn)值或者使用html頁(yè)面的lang屬性
*/
mini: true,
/*
mini: 迷你按鈕，用于重新打開(kāi)MyukiGCard（在頁(yè)面底部中間位置）
默認(rèn)值: true
*/
darkmode: 2,
/*
darkmode: 夜間模式
默認(rèn)值: 1
可選值: 0、1、2、3
0: 禁用夜間模式
1: 跟隨系統(tǒng)（如果系統(tǒng)支持夜間模式）
2: 根據(jù)時(shí)間，下午6時(shí)～上午6時(shí)打開(kāi)夜間模式
3: 常開(kāi)夜間模式
*/
maxWidth: "480px",
/*
maxWidth: MyukiGCard的最大寬度
默認(rèn)值: 480px
*/
fontFamily: "",
/*
fontFamily: 字體，為空或不設(shè)置將使用默認(rèn)字體
*/
hitokoto: {
"enable": true,
/*
enable: 是否啟用一言API
默認(rèn)值: false
*/
"cats": ["d", "i", "k"],
/*
cats: 句子類型，詳見(jiàn)：https://developer.hitokoto.cn/sentence/#句子類型-參數(shù)
默認(rèn)值: []
a: 動(dòng)畫, b: 漫畫, c: 游戲, d: 文學(xué), e: 原創(chuàng), f: 網(wǎng)絡(luò),
g: 其他, h: 影視, i: 詩(shī)詞, j: 網(wǎng)易, k: 哲學(xué), i: 抖機(jī)靈
*/
"offline": "蘭博基尼和法拉利能一樣嗎？分手！",
/*
offline: 一言API請(qǐng)求錯(cuò)誤時(shí)用于替換的離線語(yǔ)句
*/
"color": "#70a1ff",
/*
color: 一言語(yǔ)句顏色
默認(rèn)值: #70a1ff
*/
},
/*
hitokoto: 一言API
注: 不兼容IE
*/
links: [{
"title": "My Blog",
"url": "https://stackblog.cf/",
"type": "primary",
"target": "_blank"
}, {
"title": "My GitHub",
"url": "https://github.com/Uyukisan",
}, {
"title": "MyukiGCard Usage",
"url": "https://github.com/Uyukisan/MyukiGCard",
}],
/*
導(dǎo)航鏈接列表
title: 鏈接的標(biāo)題
url: 鏈接地址
type: 鏈接按鈕的類型，包括：
default | primary | secondary | success | danger | waring | info | light | dark | link
如果不提供type，默認(rèn)為dafault
target: 在何處打開(kāi)鏈接，包括：
_blank（新窗口）| _self(默認(rèn)) | _parent(父框架) | _top(整個(gè)窗口) | framename(指定的框架)
如果不提供target，將使用默認(rèn)
*/
});
/*
方法：close()
*/
MyNavCard.close();
// 使用回調(diào)函數(shù)
MyNavCard.close(closeCallBack);
function closeCallBack() {
console.log("關(guān)閉回調(diào)函數(shù)...");
}
/*
方法：open()
*/
MyNavCard.open();
// 使用回調(diào)函數(shù)
MyNavCard.open(openCallBack);
function openCallBack() {
console.log("打開(kāi)回調(diào)函數(shù)...");
}
</script>
