Cufon 和 Jquery Magic 预览

Question

Jquery Magic 预览允许用户输入文本并自动更新（很像这个“提交字段”与下面的预览加载一起使用！）。我希望用户能够输入文本，然后使用 Cufon 字体来接管他们所写的内容（或者只是以 cufon 字体输入）。

$(function() {
$('form.example input:text').magicpreview('mp_'); 
});

Cufon.replace('p#mp_trythis1');

示例如下： http://twmorton.com/magicpreviewjquery/

Answer 1

好吧，我需要的一个更好的例子是预览字体，就像在这个网站上一样：

http:// /www.fontspace.com/mario-arturo/sahara

当您输入所需内容时，运行预览的任何脚本都会刷新预览以显示您输入的内容。

Answer 2

这是一个简化版本（没有 magicpreview）：

html 部分：

<h1>Cufon Test</h1>
<input id="in" type="text">
<div id="out"><h1>Start typing ...</h1></div>

javascript 部分：

Cufon.replace('h1');
$('#in').keyup(function(){
    $('#out').html('<h1>'+$(this).val()+'</h1>');
    Cufon.replace('#out h1');
});

参见实时示例 此处

编辑：您可以在此处看到作为 jQuery 插件实现的两个替代版本。

• v1 在焦点丢失后 1000 毫秒更新仅当脏
• v2 在最后一次 keyup 之后 1000 毫秒更新时