主页中bilibli和github链接,在新标签页中打开
This commit is contained in:
@@ -7,21 +7,20 @@ onMounted(() => {
|
|||||||
|
|
||||||
// 界面特效字体
|
// 界面特效字体
|
||||||
let nameElement = document.getElementById("my-name");
|
let nameElement = document.getElementById("my-name");
|
||||||
if( nameElement == null){
|
if (nameElement == null) {
|
||||||
console.error('未找到元素my-name')
|
console.error('未找到元素my-name')
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
let colorNum = 66;
|
let colorNum = 66;
|
||||||
let colorNumReverse = false;
|
let colorNumReverse = false;
|
||||||
setInterval(() => {
|
setInterval(() => {
|
||||||
if(colorNumReverse)
|
if (colorNumReverse) {
|
||||||
{
|
|
||||||
colorNum--;
|
colorNum--;
|
||||||
if(colorNum<=66)
|
if (colorNum <= 66)
|
||||||
colorNumReverse = !colorNumReverse;
|
colorNumReverse = !colorNumReverse;
|
||||||
}else{
|
} else {
|
||||||
colorNum++;
|
colorNum++;
|
||||||
if(colorNum>=255)
|
if (colorNum >= 255)
|
||||||
colorNumReverse = !colorNumReverse;
|
colorNumReverse = !colorNumReverse;
|
||||||
}
|
}
|
||||||
nameElement.style.backgroundImage = `linear-gradient(45deg, rgb(${colorNum}, 66, ${255 - (66 - colorNum)}), rgb(${255 - (66 - colorNum)}, 66, ${colorNum}))`;
|
nameElement.style.backgroundImage = `linear-gradient(45deg, rgb(${colorNum}, 66, ${255 - (66 - colorNum)}), rgb(${255 - (66 - colorNum)}, 66, ${colorNum}))`;
|
||||||
@@ -35,10 +34,10 @@ onMounted(() => {
|
|||||||
<div class="name" id="my-name">特恩(TONE)</div>
|
<div class="name" id="my-name">特恩(TONE)</div>
|
||||||
<div class="self-introduction">一名计算机类专业在校本科大二学生</div>
|
<div class="self-introduction">一名计算机类专业在校本科大二学生</div>
|
||||||
<div class="button-container">
|
<div class="button-container">
|
||||||
<a href="https://space.bilibili.com/474156211">
|
<a href="https://space.bilibili.com/474156211" target="_blank">
|
||||||
<button class="button" id="button-resource">哔哩哔哩</button>
|
<button class="button" id="button-resource">哔哩哔哩</button>
|
||||||
</a>
|
</a>
|
||||||
<a href="https://github.com/tonecn">
|
<a href="https://github.com/tonecn" target="_blank">
|
||||||
<button class="button button-style2" id="button-code">GitHub</button>
|
<button class="button button-style2" id="button-code">GitHub</button>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
@@ -146,6 +145,7 @@ onMounted(() => {
|
|||||||
height: 40px;
|
height: 40px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width: 800px) {
|
@media screen and (max-width: 800px) {
|
||||||
.main-container {
|
.main-container {
|
||||||
height: calc(v-bind(containerHeight) + 15px);
|
height: calc(v-bind(containerHeight) + 15px);
|
||||||
|
|||||||
Reference in New Issue
Block a user