试图实现js文本化器

时间:2013-02-02 08:06:23

标签: javascript

我正在尝试使用来自http://kiro.me/projects/textualizer.html的js文本化器,但它不适用于我,我有一个小小的小提琴,我想知道是否有人可以解决这个问题。

http://jsfiddle.net/Zk2tr/2/

HTML

<script src="https://raw.github.com/krisk/textualizer/master/textualizer.min.js"></script>
<div id="output"></div>
Not Working

JS

var list = ['first blurb', 'second blurb', 'third blurb'];  // list of blurbs

var txt = $('#output');  // The container in which to render the list

var options = {
  duration: 1000,          // Time (ms) each blurb will remain on screen
  rearrangeDuration: 1000, // Time (ms) a character takes to reach its position
  effect: 'random',        // Animation effect the characters use to appear
  centered: true           // Centers the text relative to its container
}

txt.textualizer(list, options); // textualize it!
txt.textualizer('start'); // start

1 个答案:

答案 0 :(得分:1)

试试这个例子:

  

http://jsfiddle.net/Zk2tr/9/

为了使其正常工作,您需要添加一些初始样式。例如:

#output {
  font-size: 40px;
  height: 200px;
  margin-top: 50px;
  padding: 10px;
  text-align: center;
  border: 1px solid gray;
}