Javascript html上的缩放文本加载并在同一页面的不同位置淡出

这是用于带有CSS和Javascript的HTML网站

我正在尽我最大的努力归档以下内容，但我没有得到所需的

这是为标志，这是一个文本，这将放大和缩小时，页面加载，然后它去坐在它的位置

例如： 1.在页面加载时，文本“Hello”缩放大小200%从上角标题向页面中心开始 2.页面加载继续-假设页面加载的50%，文本标题向中心的缩放为500% 3.页面加载完成-文本“hello”以800%的缩放率居中 4.暂停3秒钟 5.缩小到500%朝向左上角（徽标位置） 6.缩小到200%朝向左上角（徽标位置） 7.当接触到徽标时淡出 8.标志出现

HTML分区：

<div id="hello">
<h1 style="zoom: 200%; transition: zoom 1s ease-in-out;">hello </h1>
</div>

---

尝试使用

.animate（）

//3。页面加载完成-文本“hello”，
//已通过缩放800%调整到中心位置
$（“#你好”）。制作动画({
缩放：“800%”，
左：window.innerWidth/2
}，3000，函数（）{
//4.暂停3秒钟
美元（此）。延迟（3000）
//6.缩小到200%朝向左上角，
//（标志位置）
//7.到达徽标时淡出8.徽标出现
.制作动画({
缩放：“200%”，
左：0
}，3000，函数（）{
$（此）.fadeOut（）
})
})

你好

html

似乎没有包含id为

的元素

“hello”

？缺少它。。。有没有像我所期待的那样可能的文本？太好了，这正是我想要的。完美的我还有一个问题。当“hello”朝左转弯时，它能使文字“ello”褪色并使字母“H”朝向徽标吗？@JohnFranky“当“hello”朝左转弯时，它能使文字“ello”褪色并使字母“H”朝向徽标吗？”是的。最后

.animate（）

尝试利用

.animate（）

的

start

功能设置

\hello

html

到

“H”

，在

ello

之前，调用

上的
.fadeOut（3000）
\hello span

我试图添加ello和.fadeOut（3000）我注意到了。。我想我做错了什么。。你能告诉我在哪里添加这个来隐藏“ello”并且只取“H”？@JohnFranky可以发布jsfdle中的“尝试添加ello和.fadeOut（3000）”？

function pageFullyLoaded()
{
    var elem = document.getElementById("hello");
    elem.style.zoom = "500%";
}