我有一个向用户显示重要文本的元素，因此我想将其动画化到 Pane 中( Action 吸引眼球)，而不是仅仅将其放在用户可能会错过的地方。
如何让它默认显示(对于关闭 javascript 进行冲浪的 1% 左右的用户)，而对其余的用户以动画方式显示？
使用
$(document).ready(function(){
$('#messagecenter').hide();
$('#messagecenter').show('fade', 'slow');
})
使元素加载可见，然后消失，然后淡出。
display:hidden;
$(document).ready(function(){
$('#messagecenter').show('fade', 'slow');
})
当然会为没有 Javascript 的用户隐藏它。
有什么好的办法吗？
最佳答案
简单的方法:让启用 JS 的用户立即隐藏内容 将其包含在页面中，而不是等待整个文档加载:
<div id="messagecenter">Albatross!</div>
<script type="text/javascript">
$('#messagecenter').hide();
$(document).ready(function() {
$('#messagecenter').show('fade', 'slow');
});
</script>
这通常足以在页面加载时停止内容呈现的闪烁。但如果内容复杂/庞大，则可能不会。在这种情况下:
水密方式:在启用 JS 的情况下，为祖先元素(例如 body)添加一个类，使用 CSS 来确保只有在 JS 启用时才默认隐藏正在加载的内容:
<head>
<style type="text/css">
body.withjs #messagecenter { visibility: hidden; }
</style>
<script type="text/javascript">
$(document).ready(function() {
$('#messagecenter').show('fade', 'slow');
});
</script>
</head>
<body>
<script type="text/javascript">
$(document.body).addClass('withjs');
</script>
...
<div id="messagecenter">Albatross!</div>
关于javascript - 显示一个元素...除非用户打开了 javascript，然后将其淡入漂亮且漂亮？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5641051/