寻找一种方法,使这种JS效果适用于我的页面上的所有文本,加载

Looking for a way to make this JS effect apply to all text on my page, on load

本文关键字:我的 加载 文本 适用于 一种 方法 寻找 JS      更新时间:2023-09-26

我发现了这个小提琴(不是我),并试图找出如何改变它,而不是当文本被点击时发生的效果,效果发生在页面上的所有文本,当页面加载。谢谢!

下面是小提琴的代码:

function fx(o)
{
  var $o=$(o);
      $o.html($o.text().replace(/(['S])/g,'<span>$1</span>'));
      $o.css('position','relative');
      $('span',$o).stop().css({position:'relative',
                               opacity:0,
                               fontSize:84,
                               top:function(i){return Math.floor(Math.random()*500)*((i%2)?1:-1);},
                               left:function(i){return Math.floor(Math.random()*500)*((i%2)?1:-1);}
                       }).animate({opacity:1,fontSize:12,top:0,left:0},1000);
}

然后页面上有一个div:

<div style="padding:200px;"><span onlick="fx(this)">click here</span></div>

这就是加载时的问题:

JSFiddle

我是怎么得到这个工作的?

1 -给带有文本的span一个id,在本例中是xplod

2 -在$(function() { })上调用fx("#xplod"),与$(document).ready()相同