Question

我希望网页只有在加载完所有元素后才会出现在浏览器中。

我通常的解决方案是延迟显示页面，直到所有元素完成加载。我在CSS中使用它：

body {
opacity: 0;
}

- 并将此jQuery代码段放在页面的<head>

中

<script type="text/javascript">
$(window).load(function() {
        $('body').animate({opacity: 1}, 300);
}); 
</script>

- 顺利淡入整个页面。

但是，我正在处理的页面上有与之链接的MooTools库。我不想通过将jQuery链接到它来使页面更重，但我不熟悉MooTools，并且可以使用一些帮助。

问题：我在上面输入的jQuery片段的确切MooTools翻译是什么？

提前感谢您的帮助！

Answer 1

我相信你正在寻找这个：

window.addEvent('load', function() {
  $$('body').set('morph', {duration: 300}).morph({'opacity': '1'});
});

在mootools源here

中变形而不是动画

所以$('block')就像说getElementById('block')得到<div id="block"></div>

$$('body')就像getElementsByTagName(body)获取<body></body>

一样

$$('.block')也会获得<div class="block"></div>

很棒的来源here

Answer 2

window.addEvent('domready', function () {
    $("gallery").set('morph', {duration: 3000})
    .morph({opacity: 1});
});

'load'也可能有用，但从我看到的内容domready似乎更受欢迎。