Question

我正在构建一个演示聊天应用程序（使用jQuery），它应该像一个普通的聊天应用程序，配置文件图片，动画打字泡泡和消息泡泡。所有这些必须在指定时间可见，以使应用程序看起来真实。对于这个Im使用show，hide和delay，结果是不太理想，因为应用程序的所有阶段都在几秒钟内排队，使得故障查找变得困难。我想做的是将它们放在一个函数中，这样它们就可以被单独调用和排队，这样我就不会有随机元素触发和搞乱命令的风险。

function chat1() {
    $('div#chat1').queue(function () {
      $(this).show(0);
      $('div.chat1.jonProfile').show(0);
      $('div.chat1.bubble.jonBubble').hide(0).delay(3000).show(0); 
      $('div.chat1.chat-bubble.left').show(0).delay(3000).hide(0);
    });
    $('div#chat1').dequeue();
    chat2();
  }

  function chat2() {
    $('div#chat2').queue(function () {
      $(this).show(0);
      $('div.chat2.bubble.jonBubble').hide(0).delay(7000).show(0);
      $('div.chat2.chat-bubble.left').hide(0).delay(7000).show(0).delay(3000).hide(0); 
    });
    $('div#chat2').dequeue();
    chat3();
  }

  function chat3() {
    $('div#chat3').queue(function () {
      $(this).show(0);
      $('div.chat3.julieProfile').hide(0).delay(10000).show(0);
      $('div.chat3.chat-bubble.right').hide(0).delay(10000).show(0).delay(3000).hide(0);
      $('div.chat3.bubble.julieBubble').hide(0).delay(13000).show(0);
    });
    $('div#chat3').dequeue();
  }

这就是我现在正在做的事情。如上所述，当chat1函数完全完成时，我宁愿调用chat2函数。

如果有更好的方法，请告诉我。感谢

排队显示和隐藏指定秒数的大量元素

0 个答案: