javascript - 当文本输入有焦点时淡化正文背景

标签 javascript jquery html css

<分区>


想改进这个问题吗? 更新问题,使其只关注一个问题 editing this post .

关闭 7 年前

我在表单中有一个简单的文本输入框。当输入框具有焦点时,我希望正文背景在其上覆盖。

解决这个问题的最佳方法是什么,jquery?

最佳答案

您可以使用 CSS :focus 选择器来做到这一点。

#overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #333;
  opacity: .5;
  display: none;
}
#text {
  z-index: 1000000;
  position: relative;
}
#text:focus ~  #overlay {
  display: block;
}
<input type="text" id="text">
<div id="overlay"></div>

关于javascript - 当文本输入有焦点时淡化正文背景,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34122249/

上一篇:javascript - 美化或着色网页上的 html 以提高可读性

下一篇:html - 使用 CSS 使开关切换更暗

相关文章:

Javascript:将变量传递给函数会破坏函数

javascript - 如何将多个css文件添加到CKEditor编辑区

javascript - 在各个 HTML 表格行中添加来自 HTML 输入文件的文件

javascript - 停止文件上传

jquery - 当所有验证完成后,调用成功 jQuery 验证插件的函数

html - 带背景的中心链接,不让背景占据整个宽度?

css - 在响应式流动的网站线框上将父项中的子项居中

javascript - 如果在数组中的 x 之后,如何找到最接近另一个数组元素 x 的数组元素,其中 y 更近?

jquery 切换按钮值

html - 背景图像的 float