gpt4 book ai didi

javascript - 使用 eventListener'scroll' 后如何在滚动上修复标题

转载 作者:行者123 更新时间:2023-11-28 00:31:01 28 4
gpt4 key购买 nike

在我的 Html 代码中,我想使标题在滚动时固定在顶部。当我在 body 标签中编写 javascript 代码时它工作正常。但是当我创建一个新的 .js 文件并在脚本标签中写入 .js 文件路径时,页面不会向下滚动

enter code here
const nav = document.getElementById("main")
let topOfNav = nav.offsetTop;
function fixNav() {
if (window.pageYOffset >= topOfNav) {

nav.classList.add('fixed-nav')
} else {
nav.classList.remove('fixed-nav')

}
}
window.addEventListener('scroll', fixNav)
.fixed-nav {
position: fixed;
top: 0;
left: 0;
width: 100%;
}
<nav class="navbar navbar-expand-lg navbar-light" id="main">
<a class="navbar-brand" href="index.html">
<img class="top_logo" src="logo.jpg"
alt="">TestMyCode
</a>
</nav>
<script src="theme.js"></script>

我在 jQuery、popper.js 和 bootstrap.min.js 之后写了这个。最初在标题中我添加了

enter code here

但是页面停止滚动,一直卡在顶部,如何通过script标签添加js使其滚动?

最佳答案

根据你的 html 你写了这个:

<script src="theme.js"></script>

尝试这样做......

   <html>
<head>
<script type = "text/javascript" src = "filename.js" ></script>
</head>

<body>
.......
</body>
</html>

同样重要的是要注意,如果您将文件放在文件夹中,则需要在 src 中说明该文件如果不是文件目录,则需要提供绝对文件路径

关于javascript - 使用 eventListener'scroll' 后如何在滚动上修复标题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54408076/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com