我正在建立一个教堂网站,我是编码新手,所以我不完全理解伪代码,但这是我现在所拥有的:
@keyframes offsetFix {
0% {
background-color: #ffffff;
}
90% {
background-color: #ffffff;
}
91% {
background-color: #fefffe;
}
100% {
background-color: #eeeeee;
}
}
body {
background-color: #ffffff;
animation: offsetFix 20s linear infinite;
}
.button,
a:link,
a:visited {
border: none;
color: #960018;
padding: 0px 0px;
text-align: center;
text-decoration: none;
display: block;
width: 100px;
height: 100px;
position: fixed;
top: 316px;
/* John 3:16
Psalms 25:7 */
left: 257px;
z-index: 7777777;
font-size: 0px;
border-radius: 0px;
transition-duration: 0.01s;
cursor: crosshair;
}
.button:hover,
a:hover {
background-color: #000000;
/* Black */
color: #000000;
width: 9px;
height: 9px;
transform: translateY(-4px) translatex(-4px);
}
.button:active,
a:active {
background-color: #960018;
/* Carmine */
color: #000000;
width: 9px;
height: 9px;
transform: translateY(-4px) translatex(-4px);
}
}
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="style.css" />
<title>Browser</title>
<div class="button" id="button" style="background-color:black">This is a button</div>
<!--place the script tag in your head section-->
<script type="text/javascript">
function buttonRandom() {
<!--this gets called by setTimeout-->
setInterval(() => {
if (Math.random() >= 0.5) <!--Chance = 50%-->
button.style.visibility = "hidden"; <!--set element's visibility to hidden-->
}, 1e3); <!--Set the frequency of this interval to every 1 sec (1*10^3 ms)-->
}
};
</script>
<!--close script-->
<body onload="buttonRandom()">
<!--call to my initial function-->
</head>
我尝试设置一个间隔,以便按钮的“样式”会随机改变,这样它要么不会,要么在视觉和功能上被禁用,但按钮却完全消失了。 虽然我还没有使它成为一个有效的链接,但我希望得到一些关于如何完成它的提示。由于页面格式的工作原理,最简单的方法是不使用脚本文件,但如果绝对必要,我可能可以使用脚本。
问题是,一旦隐藏按钮,您就不会恢复可见性,因此它仍然永远隐藏。您需要添加一个像这样的 else 子句:
function buttonRandom() {
setInterval(() => {
let res = Math.random();
console.log(res);
if (res >= 0.5) {
button.style.visibility = "hidden";
} else {
button.style.visibility = "";
}
}, 1e3);
}
让我知道这是否是您正在寻找的结果:)