jquery - 隐藏div时如何设置背景颜色

Question

我向下滑动并在点击时显示一个隐藏的 div。

<style>
    hide { display: hidden;}
    content {  background-color: black; }
</style>

<div class="content, hide">

<script>
    $(.content).slideDown();<br>
    $(.content).removeClass("hidden");
</script>

除了设置背景颜色外，一切正常。我尝试使用 jQuery .css() 设置背景颜色，但它不起作用。当我删除 hide 类时，它起作用了。

Answer 1

所以有几点:

1. 从类名中删除逗号 <div class="content hide">...</div>

2. CSS 类应该以句号/句点 (.) 开头

   .hide { display: hidden; }
.content { background-color: black; }

3. display: hidden是正确的，你在寻找display:none在你的隐藏类中。或者，您正在寻找 visibility:hidden .

4. jQuery 选择器应该包含引号 $('.content')
5. 您要删除的类应该隐藏而不是隐藏$('.content').removeClass("hide");
6. 从技术上讲，您不需要删除 .hide分类为 slideDown()将添加 display:block覆盖。
7. 在你的脚本中你似乎有一个随机的<br>这将导致语法错误。

$(function () {
  $('.content').slideDown();
});

.hide { display: none; }
.content {
  background-color: black;
  height: 100px;
}
.content h1 { color: white; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="content hide">
  <h1>My Content</h1>
</div>