我在 css 文件中定义了一个 div,如下所示:
#toolbar
{
position:relative;
top: 0;
height: 50px;
background-color: #F4A83D;
width: 100%;
text-align: center;
display: hidden;
}
然后,在我的 HTML 文件中:
<div id="toolbar">
TestApp ToolBar
<br />
You are visiting:
<%=ViewData["url"] %>
</div>
最后,我的 html 页面顶部有以下脚本,我认为当页面加载时它会在我的 div 中淡出:
<script src="../../Scripts/jquery-1.3.2-vsdoc.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#toolbar").fadeIn("slow");
});
</script>
我做错了什么?它立即出现,就好像它根本没有淡入一样。我没有在 jquery 脚本中正确访问我的 div 吗?
<小时/>根据一些答案,我将 div 更改为:
<div id="toolbar" style="visibility: hidden">
TestApp ToolBar
<br />
You are visiting:
<%=ViewData["url"] %>
</div>
使用相同的脚本调用,现在我的 div 开始隐藏并且永远不会显示。我还做错了什么?
最佳答案
参见:http://www.w3schools.com/css/pr_class_display.asp
hidden 不是显示属性的有效值。您应该使用 display:none;
这就是为什么你会立即看到它,它从未被隐藏,因为浏览器不知道如何处理 display:hidden;声明。
您可能想要可见性:隐藏;属性,因为这样工具栏将不可见但会呈现,因此它将占用文档中的空间。这将确保您的整个页面在淡入时不会被移动。
关于jquery - 如何使用 jQuery 淡入 div?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/754982/