javascript - 使用 jQuery 从字面上将文本分解到随机位置

标签 javascript jquery animation text

有一些 jQuery 示例,如何内爆文本,像这样:

http://jsfiddle.net/doktormolle/dNXVx/

我怎样才能反过来?

我想将 span 元素中的字母分解到随机位置。

最佳答案

function fx(o) {
  var $o = $(o);

  $o.html($o.text().replace(/([\S])/g, "<span>$1</span>"));
  $o.css("position", "relative");
  $("span", $o).each(function(i) {
    var newTop = Math.floor(Math.random()*500)*((i%2)?1:-1);
    var newLeft = Math.floor(Math.random()*500)*((i%2)?1:-1);

    $(this).css({position: "relative",
      opacity: 1,
      fontSize: 12,
      top: 0,
      left: 0
    }).animate({
      opacity: 0,
      fontSize: 84,
      top: newTop,
      left:newLeft
    },1000);
  });
}​

您可以在 http://jsfiddle.net/dNXVx/37/ 查看代码的运行情况。

关于javascript - 使用 jQuery 从字面上将文本分解到随机位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9656353/

相关文章:

javascript - JVector 交互式 map 不在 Rails 3 中呈现

javascript - 用不同的类号jQuery随机打开一个随机弹出div

javascript - i18next - 复数形式不正确

javascript - 如何获取实时数据?

javascript - HTML 行表选择

ios - MKMapView 淡入但不会通过动画淡出

javascript - 使用 Nodejs 信息填充选择框

jquery - 使用 Infinitescroll jQuery 插件操作时丢失变量

ios - 将 UIImage View 从 A 点移动到 B 点的最简单代码

javascript - 与 GSAP 并行播放 2 个补间?