我只想在第一次加载网站时加载特定的 set css 命令。我不希望在加载后的导航过程中加载这些集。例如,假设我想将该行为应用于这些特定的 set css 代码。
div.navbar.navbar-inverse
{
-webkit-animation: fadeInDownx 900ms linear ;
animation: fadeInDownx 900ms linear;
}
a#brand
{
-webkit-animation: appear 1500ms linear ;
animation: appear 1500ms linear;
}
我想知道怎么做。
最佳答案
你可以在你的 <head>
中加入这样简单的 javascript部分并在 body 负载事件上触发它:
<head>
<script>
function checkIfVisited () {
if (!window.localStorage.visitedPreviously) {
document.body.className += ' first-visit';
}
window.localStorage.visitedPreviously = true;
}
</script>
</head>
<body onload="checkIfVisited()">
…
它将设置 visitedPreviously
变量并将其保存在 localStorage 中(这意味着它将永远保留或直到您的脚本/用户明确删除它)。在此之前,脚本会检查此变量是否存在。
- 如果是,则表示脚本(即页面)之前已加载。
- 如果没有,它将添加一个类
"first-visit"
到<body>
元素
然后在您的 css 中将此类考虑到您的选择器中:
.first-visit .navbar.navbar-inverse
{
-webkit-animation: fadeInDownx 900ms linear ;
animation: fadeInDownx 900ms linear;
}
.first-visit #brand
{
-webkit-animation: appear 1500ms linear ;
animation: appear 1500ms linear;
}
关于html - 如何仅在第一次浏览网站时加载特定的 set css 命令?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30847349/