选择字符串中的特定字符并使用Jquery将其偏移(可视)

Question

我正在尝试使用Jquery/Javascript模仿破碎的打字机字体(因为我找不到一个).但我想让它随机哪个字母被打破.我能够分割出我想要的id的字符串,并使用我发现的一些代码来获得0和字符串总长度之间的随机数.我现在遇到的问题是用这个特定的角色做些什么.我想将其向下或向上推几个像素.我试图给它一个类,所以我可以添加一些边距或填充,但它不起作用.所以我被困在我现在的位置.

这是页面,我正在尝试用"关于"这个词:http:
//www.franciscog.com/bs/about.php

这是脚本:

<script type="text/javascript">

        function randomXToY(minVal,maxVal,floatVal)
            {
              var randVal = minVal+(Math.random()*(maxVal-minVal));
              return typeof floatVal=='undefined'?Math.round(randVal):randVal.toFixed(floatVal);
            }


        var str = $('#typehead').text();
                var strcnt = str.length;
        var exploded = str.split('');
        var rdmltr =randomXToY(0,strcnt); 
        var theLetter = exploded[rdmltr];
        theLetter.addClass("newClass");
        var toffset = $('.newClass').offset();
        alert(toffset.left + "," + toffset.top);

     </script>

Answer 1

编辑：更新以确保匹配的字符不是空格字符，并添加了@abelito建议的一些样式。

\n\n

这个怎么样： http: //jsfiddle.net/cgXa3/4/

\n\n

function randomXToY(minVal,maxVal,floatVal){\n    var randVal = minVal+(Math.random()*(maxVal-minVal));\n    return typeof floatVal==\'undefined\'?Math.round(randVal):randVal.toFixed(floatVal);\n}\n\n\nvar exploded = $(\'#typehead\').text().split(\'\');\nvar rdmltr = randomXToY(0,exploded.length);\n\n    // Make sure we don\'t get a space character\nwhile(exploded[rdmltr] == \' \') {\n    rdmltr = randomXToY(0,exploded.length);\n}\n    // Wrap the letter with a span that has the newClass\n    //   and update it in the array\nexploded[rdmltr] = \'<span class="newClass">\' + exploded[rdmltr] + \'</span>\';\n\n    // Update the content\n$(\'#typehead\').html(exploded.join(\'\'));\nvar toffset = $(\'.newClass\').offset();\nalert(toffset.left + "," + toffset.top);\xe2\x80\x8b\n

\n\n

更新：如果您想将其应用于多个： http: //jsfiddle.net/cgXa3/5/

\n