页面加载时的内联Javascript fadein

我是Javascript新手，并尽了最大努力，但尽管进行了大量搜索，但仍无法解决问题

正在尝试使用内联脚本（XHTML）在页面加载上创建项目fadein。我很想使用外部，但不能给出软件限制。这是我到目前为止开发的代码

<script type='text/javascript'>
$(document).ready(function() {
    $('#evan').fadeIn('slow');
});
</script>
<div id='evan' style='position:absolute;left:-200px;top:40%;width:80px;height:80px;background-color:red;'></div>

$（文档）.ready（函数（）{
$（'#evan'）.fadeIn（'slow'）；
});

虽然这个框确实出现了，但它并没有消失，所以我假设Javascript没有正确编写

---

如果您能提供任何帮助，我们将不胜感激。谢谢。

我认为要让fadeIn工作，必须先隐藏项目，并且元素位置（左：-200px）不在视口内

<script type='text/javascript'>
$(document).ready(function() {
    $('#evan').fadeIn('slow');
});
</script>
<div id='evan' style='position:absolute;top:40%;width:80px;height:80px;background-color:red;display:none'>Some content</div>

$（文档）.ready（函数（）{
$（'#evan'）.fadeIn（'slow'）；
});
一些内容

---

演示：

java和javascript在以下方面完全不同$（document.ready（function（）{$（'#evan'）.hide（0.fadeIn（'slow'）；}）；现在来问一个非常重要的问题。。。java部分需要放在头部，还是可以和其他部分一起放在身体里？还有，我使用的“正确”还是应该正确“？@user2503281仍然可能无法工作，因为位置

左侧：-200px