Question

我正在尝试淡化此HTML的电影div

<div class="row">
  <div id=Movies class="col-md-4">
   <h2>Movies</h2>
  <p>Some text.</p>

 </div>
</div>

我正在使用这个jquery代码

<script>
    $(function(){$("#Movies").show("slow");
                });
</script>

我也试过这个：

<script>         
          $(document).ready(function(){$("#Movies").fadeIn(3000);
                             });
</script>

但它不起作用。页面加载时没有淡入.div只是像其他元素一样加载。这有什么问题？

Answer 1

添加此CSS以使其隐藏，然后只有当页面加载

时它才会fadeIn缓慢

#Movies {
display:none;
}

Answer 2

为此起作用;必须隐藏#movie，然后在jQuery函数暗示文档准备就绪时显示。

＆＃13;

$(document).ready(function() {
  
  $("#movies").fadeIn(3000);
                             
});

＆＃13;

#movies {
  display: none;
  }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="row">
  <div id=movies class="col-md-4">
   <h2>Movies</h2>
  <p>Some text.</p>

 </div>
</div>

＆＃13;

Answer 3

首先，您必须隐藏电影div然后淡入。此外，我看到您的ID“电影”在问题代码段中没有引号。希望它有所帮助。

HTML

<div class="row">
  <div id="Movies" class="col-md-4" style="display:none">
   <h2>Movies</h2>
  <p>Some text.</p>
 </div>
</div>

的Javascript

 $(document).ready(function(){
     $("#Movies").fadeIn(3000);
});

在使用jQuery加载页面后，如何淡化div？

3 个答案: