当HTML页面加载时，将这个JS Code for Text Animation从“on click”变为自动？

Question

我正在尝试实现这个文本动画（来自https://speckyboy.com/css-javascript-text-animation-snippets/的N.10）

所以我复制了HTML，CSS代码运行正常。我摆脱了重装按钮，因为它需要消失。我知道我应该将js脚本代码复制到head部分，以便自动加载，但是......我不知道如何“重写”它以便它不再是一个点击动作...而且只是变成了一个“正常”的功能。

$(function() {
  $('.intro').addClass('go');

  $('.reload').click(function() {
    $('.intro').removeClass('go').delay(200).queue(function(next) {
      $('.intro').addClass('go');
      next();
    });

  });
})

（我明显地从链接中得到了这个）我将确保使用“.onload”来在页面加载时运行它。这可能是一件非常容易的事情，但有点困惑......

我非常感谢你的帮助！谢谢 ：）

Answer 1

这是不是的部分

$(selector).click(function() {});

在您的情况下，删除框架块

$(function() {
  $('.intro').addClass('go');

  $('.reload').click(function() {
    $('.intro').removeClass('go').delay(200).queue(function(next) {
      $('.intro').addClass('go');
      next();
    });    
  });

})

Answer 2

如果我找到了你，你删除了重新加载按钮，但这并没有反映在你的js代码中。

$(function() {   $('.intro').addClass('go');   $('.intro').removeClass('go').delay(200) .queue(function(next) {       $('.intro').addClass('go'); next();     }); })

What i did here was to remove the click event added to the non existing reload button. But you will need to tweak the code to remove the go class and cause the delay. Hope it helps.

Answer 3

将其从on上删除将其添加到document.ready就像这样

$(document).ready(function(){
   $('.intro').addClass('go');
   $('.intro').removeClass('go').delay(200).queue(function(next) {
      $('.intro').addClass('go');
      next();
    });

  });