javascript - 当击中屏幕顶部
问题描述
当点击屏幕顶部时,我将如何更改导航栏背景的颜色和文本颜色。div.textbox
我可以自己改变颜色,所以不用担心它们是什么颜色。
HTML:
<ul id="navbar">
<b>
<li><a href="#home">Home</a></li>
<li><a href="#news">News</a></li>
<li><a href="#contact">Contact</a></li>
<li><a href="#about">About</a></li>
</b>
</ul>
<h1> What is Artificial Intelligence? </h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed</p>
<div class="bgimg-1"></div>
<div class="text-box" id="textbox"></div>
导航栏 CSS:
ul {
list-style-type: none;
padding: 0;
overflow: inherit;
background-color: rgba(0,0,0,0);
position: fixed;
top: 0;
width: 100%;
margin-top: 0;
min-height: 15px;
min-width: 200px;
}
li {
float:right;
}
li a {
display: block;
background-color: rgba(0,0,0,0);
color: white;
text-align: left;
padding: 15px 15px;
text-decoration: none;
float: right;
transition: 0.3s all ease-in;
border-radius: 3px;
}
li a:hover:not(.active) {
background-color: rgba(0,0,0,0.3);
transition: 0.3s all ease-in;
}
非常感谢您的帮助
解决方案
推荐阅读
- python - 如何将自定义包中的模块正确导入 AWS Lambda 函数?
- haskell - 从haskell中的char和int [([Char], Int)]列表中输出一个字符串列表([String])
- c - 如何将时间输入到结构中?
- html - 仅悬停覆盖图像上的 Bootstrap 4 卡
- django - 如何提高 PDF 文件(Django)的渲染时间?
- javascript - 将提交的表单转换为表单数据对象
- pandas - 如何使用 PIL 从 pandas 数据框中的行值创建图像?
- javascript - 如何减小图片的大小并将其变成视差效果?
- python - 如何将电报频道中的消息保存为变量
- python - 试图从 MySQL 获取数据